node_modules 依赖项中的 Webpack fs.readFileSync答案

【问题标题】：Webpack fs.readFileSync inside a node_modules dependencynode_modules 依赖项中的 Webpack fs.readFileSync
【发布时间】：2019-09-05 02:31:22
【问题描述】：

我将依赖于errorhandler 的服务器端代码捆绑在一起，它本身就是 fs.readFileSync 的一个 css 文件。这没有包含在我的捆绑包中，当我尝试执行捆绑包时，它会立即中断：

Error: ENOENT: no such file or directory, open '/public/style.css'

我的目标是捆绑一些服务器端节点，对其进行摇树摇动，然后将其推入一个我可以简单执行的 docker 容器中。我的 repo 设置和自定义注册表使得在构建时在 docker 容器中运行 npm install 变得不切实际。 Webpack 似乎是一个可靠的策略。

我发现了一个建议，建议将此添加到我的 webpack 配置中：

module.exports = {
  ...
  node: {
    __dirname: false,
    __filename: false,
  },
  ...
}

这确实将错误更改为

Error: ENOENT: no such file or directory, open '/Users/{me}/Projects/errorhandler-ts-webpack-err/dist/public/style.css'

这似乎没有实际意义。我一直在寻找能够对内联 fs.readFileSync 调用进行字符串化的 webpack 加载器，但我还没有成功。

此处的示例代码库：https://github.com/TylerR909/errorhandler-ts-webpack-err/tree/no-typescript

我希望构建和运行这种依赖关系以及其他类似的依赖关系。

【问题讨论】：

这些答案似乎是相关的：How to copy static files to build directory with webpack.
那些对调用 fs.readFileSync 以将其包含在包中的依赖项一无所知，并为每个有此类问题的依赖项随机添加一个 require('errorhandler/public/style.css)`，考虑到它什么都没有，这似乎很糟糕直接使用我的代码。此外，这不一定将其正确链接到确实希望从某处的 fs.readFileSync 找到 public/style.css 文件的依赖项。
那是因为你根本不能调用 fs 方法。您必须使用 require 或编辑配置来捆绑该文件。您需要的信息就在里面。
我不是调用fs 的那个，我正在加载的node_module 是。鉴于我不是 errorhandler 模块的维护者，我无法做出该决定。我坚持要么将其标记为外部，要么将其从项目中完全删除。我暂时选择了前者。
你可以看看这个：github.com/browserify/brfs.

标签： javascript typescript express webpack

【解决方案1】：

我偶然发现了同一个包的相同问题 - 错误处理程序。

通过将所有配置值设置为 true，并让 NodeStuffPlugin 执行其操作（使用 polyfill），错误更改为 -

message: "uncaughtException: ENOENT: no such file or directory, open 'node_modules\errorhandler\public\style.css'\n" +

所以设置以下配置

      node: {
        global: true,
        __filename: true,
        __dirname: true,
      },

与在 dist 目录中复制 nodemodule 有助于解决此错误

plugins: [
    new CopyPlugin({
      patterns: [
        // ........
        { from: './node_modules/errorhandler/**' },
      ],
    }),
  ],

尽管 ENOENT 错误消失了，但我没有更多的测试用例来检查此修复的有效性。

【讨论】：