找不到模块：错误：无法解析模块“fs”

Posted 2023-02-22

【中文标题】找不到模块：错误：无法解析模块“fs”

【英文标题】：Module not found: Error: Cannot resolve module 'fs'

【发布时间】：2018-06-29 17:40:23

【问题描述】：

我正在使用 Babel 和 Webpack 制作一个 React 应用程序，并且我想使用来自 npm 的 file-exists 包。我已经安装了这个包并将其保存为我的项目的依赖项。运行 npm start 后出现此错误：

./~/file-exists/index.js 中的错误 找不到模块：错误：无法解析 C:\GitHub\CryptoPrices\node_modules\file-exists 中的模块“fs” @ ./~/file-exists/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 的新手，所以我有点迷茫。

【参考方案1】：

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

据我了解，主要问题似乎是您无法在浏览器解释的客户端（前端）代码中调用服务器端（节点）方法。您必须从服务器调用它们。

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

您可以通过修改对 fs 方法的调用在服务器端某处进行，或者通过找到一个等效的浏览器支持的包来解决核心问题，该包提供与您需要的 fs 方法相同的功能，但可以在浏览器中运行。

快速搜索“浏览器的 fs 模块”会显示各种可能满足您需求的选项，例如 fs-web、browserify-fs 或 filer。

这是一个类似的问题，有一些见解。 Use fs module in React.js,node.js, webpack, babel,express

【讨论】：

您可能还会发现此线程很有趣。它正在讨论在浏览器中使用 fs 的类似情况。 ***.com/questions/46467858/…

这是另一个相关问题。 ***.com/questions/35951874/…

还有关于这个主题的另一个帖子...***.com/questions/23959868/…

感谢您的回答。这个错误让我们烦恼了很久。最后将代码从 NextJS 模块移动到 Cloud Functions 模块，它的工作就像一个魅力。

【参考方案2】：

node: 
  fs: 'empty'

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

【讨论】：

我已经试过了，错误消失了，但是文件存在不起作用