如何使用webpack处理Web Workers“标准”语法？

Question

我想知道是否有可能在webpack中处理Web Worker“标准语法”（例如var worker = new Worker('my-worker-file.js');）以及如何处理？

我知道worker-loader但据我所知，它需要特定的语法，并且与标准语法不兼容。

换句话说，是否可以在不更改代码的情况下将该文件与webpack捆绑在一起？ - ＆GT; https://github.com/mdn/simple-web-worker/blob/gh-pages/main.js#L8

使用browserify，我会使用workerify转换，但我在webpack的世界中找不到任何内容。

Answer 1

您可以将Webpack配置为将worker js文件打包到单独的包中。在webpack.config.js：

{ entry: { bundle: './app/main.js', worker: './app/my-worker-file.js' }, output: { filename: '[name].js' } ... }

通过这种方式，您可以获得两个包：bundle.js包含主应用程序，worker.js包含工作者入口点。然后，在主要包中，您可以执行new Worker('worker.js')

worker-loader基本上也一样。每当通过它加载某些东西时，它就会创建一个单独的bundle条目，可以这么说，它自动命名为[hash].worker.js。然后，它将此文件名存储到从require('worker!...')返回的函数中，该函数只将其传递给new Worker。最后，它与我上面描述的过程完全相同，唯一的区别是捆绑包的名称是自动管理的。