使用webpack和VUe 2- WEBPACK_IMPORTED_MODULE resources_workerd default.a的工人不是构造函数

Question

我正试图在Vue项目中使用Worker。我使用webpack和工人装载机包加载本地工人文件.

我正在使用这个版本：

- "vue": "^2.5.11",
- "webpack": "^3.6.0"
- "worker-loader": "^3.0.8"

正如文档所解释的，在我的webpack配置中，我添加了：

{
    test: /\.worker\.js$/,
    use: { loader: 'worker-loader' }
}

这里是我的代码片段

......
import Worker from '../resources/worker'
const worker = new Worker();
worker.postMessage({ action: 'compress', data: 'aaaaaa' });
worker.addEventListener("message", function (event) {
    console.log('--------------------');
});
......

在“=()”中，我得到了下一个错误

__WEBPACK_IMPORTED_MODULE_10__resources_worker___default.a is not a constructor

有人能帮我加载本地工人的档案吗？

提前感谢

Answer 1

我可以解决这个问题，升级一些项目包。

"vue": "^2.7.8",
"vue-loader": "^14.2.2",
"vue-template-compiler": "^2.7.8",
"webpack": "^4.46.0",
"webpack-cli": "^4.10.0",

并修改了wepack配置，以便在内联中使用工作人员。

{
    test: /\.worker\.(c|m)?js$/i,
    // test: /\.worker\.js$/,
    loader: 'worker-loader',
    options: {
        inline: 'fallback',
        publicPath: 'your url',
    },
},

使用此配置，它将在公共路径中创建一个分离的worker js文件，该文件在调用"new ()“时加载。