Webpack4 + babel8 + coreJs @ 3下CommonJs的奇怪错误

Question

这是入口：

// index.js
const {test} = require('./handle')
test()

这是一个commonjs模块

// handle.js
module.exports = {
  test() {
    console.log('>>>>>   handle get trigger')
    console.log(typeof [])
  }
}

编译成功，然后在运行时出现此错误

Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'

如果我从console.log(typeof [])中删除handle.js，则错误消失。

我的babel配置是：

{
                test: /\.jsx?$/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ["@babel/preset-env"],
                        plugins: [
                            [
                                "@babel/plugin-transform-runtime",
                                {
                                    "corejs": 3
                                }
                            ],
                            "@babel/plugin-syntax-dynamic-import"
                        ]
                    }
                },
                include: /src/
            },

当我使用ES6模块编写此错误时，错误也会消失。

Answer 1

@babel/plugin-transform-runtime将import添加到我的文件中！因此，它成为ES6Module和CommonJs的混合使用！那会导致问题！！！！

因此，我们只能使用Es6module或添加babel插件@babel/plugin-transform-modules-commonjs