node.js - webpack 中的匀场模块

Question

我正在构建一个带有模块 tiny-worker 的 typescript 项目，作为依赖项的依赖项(不是直接依赖项)。 tiny-worker 使用浏览器中不存在的 Node 的 child_process。

我遵循 Webpack 的匀场指南，并将以下内容添加到我的 webpack 配置中:

plugins: [
    new webpack.ProvidePlugin({
      'tiny-worker': 'Worker'
    })
  ],

但是，当我尝试运行 webpack 时，它仍然提示 tiny-worker 中的 child_process

ERROR in ./node_modules/tiny-worker/lib/index.js
 @ ./node_modules/tiny-worker/lib/index.js 8:11-35
 @ ./node_modules/pollenium-anemone/node/src/classes/MissiveGenerator.js
 @ ./node_modules/pollenium-anemone/node/main.js
 @ ./src/globals/anemoneClient.ts
 @ ./src/classes/BopManager.ts
 @ ./src/classes/Market.tsx
 @ ./src/globals/markets.ts
 @ ./src/app.tsx
 @ ./src/index.ts
 @ multi @babel/polyfill ./src/index.ts

如何让 Webpack 使用 window.Worker 而不是 从 'tiny-worker' 导入 Worker

Answer 1

使用module-replace-webpack-plugin解决了这个问题

https://www.npmjs.com/package/module-replace-webpack-plugin

plugins: [
    new ModuleReplaceWebpackPlugin({
      modules: [{
        test: /^tiny-worker$/,
        replace: './shims/Worker.js'
      }]
    })
  ]

并创建了shims/Worker.js，它只是重新导出window.Worker

导出默认window.Worker