javascript - Webpack 4，Babel 转译为 ES5 和 uglifyjs-webpack-plugin 的问题

Question

尝试运行我的 webpack 生产版本时出现错误。

node_modules/webpack/bin/webpack.js -p --config webpack.config.production.js

...

ERROR in app.js from UglifyJs
Unexpected token: keyword (const) [app.js:18757,0]

...

调查这个错误，我了解到这很可能是 ES6 代码找到进入uglifyjs-webpack-plugin

但是，如果我设置了 babel 将代码转换为 es5，为什么会这样呢？

.babelrc

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "node": "6.10",
          "esmodules": true
        }
      }
    ]
  ],
  "plugins": ["@babel/plugin-proposal-object-rest-spread"]
}

webpack 常用配置

module.exports = (env, options) => ({
  ...
  module: {
    rules: [
      {
        test: /\.js$/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-env"]
          }
        },
        exclude: /node_modules/
      },
    ...

还有我的产品配置

...
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");

...
const webpackCommonConfig = require("./webpack.config.common")();

module.exports = merge(webpackCommonConfig, {
  mode: "production",
  optimization: {
    minimizer: [
      new UglifyJsPlugin({ cache: false, parallel: false, sourceMap: false }),
    ...
    ]
  }
});

我在这里的假设是 babel 会在优化运行之前将 js 转换为 es5。我错过了什么？

这是我在写完这篇文章后才发现的一个有趣的发现。 https://babeljs.io/docs/en/babel-preset-env#forcealltransforms

尽管

注意：targets.uglify 已被弃用，并将在下一个专业中删除以支持此功能。

标签： javascriptwebpackecmascript-5uglifyjstranspiler