Webpack 5“dependOn”和目标：“es5”似乎不兼容

Question

我在使用“dependOn”条目参数时无法让 Webpack 5 输出 es5 兼容代码。

我使用 Babel 来转译我的代码，效果很好，但除非我将 webpack 目标设置为“es5”，否则 webpack 本身会输出不兼容的代码。

我正在使用入口参数“dependOn”，它的行为与目标：“web”的预期一致，但是一旦我将其更改为“es5”，我就会收到“来自 Terser 的 main.build.js 中的错误”和“意外的令牌” : punc(:) [main.build.js:3,9]”。

删除“dependOn”参数允许其编译，但随后我将供应商库添加到每个条目中。

这是重现该问题的最小 webpack 配置（注释掉 target: "es5" 或 dependentOn: "vendor" 修复它）：

const path = require('path');

module.exports = {
    mode: "production",
    target: "es5",

    entry: {
        vendor: "./src/test.js",
        main: {
            dependOn: "vendor",
            import: ['./src/main.js']
        }
    },
    output: {
        filename: '[name].build.js',
        path: path.resolve(__dirname, 'dist')
    },

    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader'
                }
            }
        ]
    }
};

“test.js”和“main.js”可以包含任何内容，如果它们只有一个“console.log”语句，构建仍然会失败。

我的包 devDependency 包含以下内容： “@babel/core”：“^7.14.3”，“@babel/preset-env”：“^7.14.2”，“babel-loader”：“^8.2.2”， "webpack": "^5.37.1", "webpack-cli": "^4.7.0"。

我的 .babelrc 包含{"presets": ["@babel/preset-env"]}

Answer 1

这可以通过改变来解决

target: "es5"

到

target: ["web", "es5"]

相关文档（ https://webpack.js.org/configuration/target/ ）中没有明确提到对这两个目标的需求，因此希望这能帮助遇到相同问题的任何人。