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" 或 dependOn: "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" 语句，构建仍然会失败。

我的包 devDependencies 包含以下内容： "@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/) 中并未明确提及对这两个目标的需求，因此希望这对遇到相同问题的任何人有所帮助。

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

Webpack 5 "dependOn" and target: "es5" appear to be incompatible

ecmascript-5

webpack-5