如何修复 Webpack 相关错误：无法将对象"#"的只读属性"导出"分配给只读属性<Object>？

Question

我正在使用webpack，如果我理解正确的话，它不支持本机Webworker语法，因此我正在尝试使用worker-loader NPM模块，但是我正在得到一个奇怪的错误。

可以在这里找到该模块。

我的webpack配置：

module.exports = {
    entry: "./app",
    output: {
        path: __dirname + "/build",
        filename: "bundle.js"
    },
    watch: true,
    module: {
        rules: [{
            test: /.worker.js$/,
            use: {
                loader: 'worker-loader'
            }
        }]
    }
}

我的代码触发错误：

import Worker from '../workers/sim.js';
class Synapse {
  // ...
}
module.exports = Synapse;

错误：

Cannot assign to read only property 'exports' of object '#<Object>'?

指向module.exports = Synapse

Answer 1

将CONCORJS module.exports与ES模块混合时，您会遇到此错误。您必须将module.exports更改为其ES模块对应物export default：

import Worker from '../workers/sim.js';
class Synapse {
  // ...
}
export default Synapse; // ES Module syntax

Answer 2

您正在在同一文件中进行导入和导出，而webpack不允许最好喜欢这个

const {Worker} = require('../workers/sim.js');
class Synapse {
  // ...
}
module.exports = {Synapse};