在 Web Worker 中导入模块时，无法在模块外部使用 import 语句

Question

我正在尝试在 Web Worker 中导入一个模块，该模块又导入另一个模块并收到以下错误Uncaught SyntaxError: Cannot use import statement outside a module。我的网络工作者正在导入这样的脚本：

importScripts(
  './utils.js',
  './nn.js'
);

错误指向第二行'./utils.js'，但其实际来源是第一行，utils.js如下所示：

import * as DG from 'datagrok-api/dg';

我尝试设置"type": "module"in package.json，但这导致我无法使用Webpack编译我的项目并产生其他错误。

我还尝试创建一个工作人员，new Worker('my.worker.js', {type: "module"})以便我可以import在其中使用语句，但在这种情况下，我无法向工作人员发布消息，甚至没有收到任何错误。此外，除了 Chrome 之外，模块工作人员在任何地方都不受支持。

我尝试使用workerize-loader管理网络工作者，但它不适用于我正在使用的Webpack 5 。

所以我的问题是：如何在包含模块导入的 Web Worker 中导入模块？

Answer 1

据我所知，webpack 不会处理使用 导入的脚本importScripts()，这意味着如果您想使用，importScripts()则必须配置 webpack 以输出utils.js模块的编译版本。

importScripts()但我不知道如果你正在使用 webpack，为什么还要麻烦使用它呢？

你可以import './utils.js'在你的worker中编写，webpack在构建你的worker脚本时会将它们捆绑在一起。