模块未找到:错误:无法解决模块'fs‘

Question

我正在用Babel和Webpack制作一个react应用程序，我想使用npm的file-exists包。我已经安装并保存了包，作为我的项目的依赖项。运行npm后，我得到以下错误：

./~/file中的错误-存在/index.js 模块未找到:错误:无法解析C:\GitHub\CryptoPrices\node_modules\file-exists中的模块'fs‘ @./~/file-已存在/index.js 3:9-22

file-exists使用fs作为依赖项，但由于某种原因，它无法工作。如果我在任何地方都不需要file-exists，那么Npm就会启动和运行，没有任何问题。

这是我的webpack配置文件：

module.exports = {
  entry: [
    './src/index.js'
  ],
  output: {
    path: __dirname,
    publicPath: '/',
    filename: 'bundle.js'
  },
  module: {
    loaders: [{
      // exclude: /node_modules/,
      loader: 'babel',
      query: {
        presets: ['react', 'es2015', 'stage-1']
      }
    }]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  devServer: {
    historyApiFallback: true,
    contentBase: './'
  }
};

我是Webpack和Babel的新手，所以我有点迷路了。

Answer 1

看起来，您正在调用fs file-exists方法在您的index.js文件。我不确定您是在什么上下文中调用该方法，但这看起来像客户端对服务器端方法的调用。我最近遇到了一个类似的问题。

据我所知，主要问题似乎是不能在浏览器解释的客户端(前端)代码中调用服务器端(Node)方法。你得从服务器上给他们打电话。

Webpack可以将fs模块代码加载到您的前端，但浏览器实际上无法解释这些Node方法并运行它们；只有Node环境才能做到这一点。(请参阅更多)

您可以通过修改对fs方法的调用，使其发生在服务器端，或者找到一个与所需的fs方法相同但可以在浏览器中运行的相同功能的浏览器支持的包来解决核心问题。

快速搜索"fs模块for browser“可以提供各种可能适合您需要的选项，比如fs-web、褐变-fs或滤片器。

这里有一个类似的问题，也有一些见解。在React.js，node.js，webpack，babel，express中使用fs模块

Answer 2

node: {
  fs: 'empty'
}

尝试将上面的代码添加到webpack配置文件中，错误就会消失。