來自 UglifyJs 的錯誤：SyntaxError：意外標記：運算符（>）

Question

嘗試運行我的 webpack 進行生產時出現錯誤。

ERROR in js/main.21dbce548a76ffc14cfb.js from UglifyJs
SyntaxError: Unexpected token: operator (>) [./~/tmi.js/lib/utils.js:3,0][js/main.21dbce548a76ffc14cfb.js:3529,20]

utils.js:3,0（與我縮小的 js 中的相同）是：

// Return the second value if the first value is undefined..
    get: (obj1, obj2) => { return typeof obj1 === "undefined" ? obj2 : obj1; },

所以我假設錯誤被拋出是因為它正在讀取 ES6 但它不理解 ES6？ （箭頭函數）

我不明白這里出了什么問題，這是我的 webpack.config.js

// changed some loader syntax after reading
// https://webpack.js.org/how-to/upgrade-from-webpack-1/

const path = require(`path`);

const webpack = require(`webpack`);
const {UglifyJsPlugin} = webpack.optimize;

const CopyWebpackPlugin = require(`copy-webpack-plugin`);
const ExtractTextWebpackPlugin = require(`extract-text-webpack-plugin`);
const configHtmls = require(`webpack-config-htmls`)();

const extractCSS = new ExtractTextWebpackPlugin(`css/style.css`);

// change for production build on different server path
const publicPath = `/`;

// hard copy assets folder for:
// - srcset images (not loaded through html-loader )
// - json files (through fetch)
// - fonts via WebFontLoader

const copy = new CopyWebpackPlugin([{
  from: `./src/assets`,
  to: `assets`
}], {
  ignore: [ `.DS_Store` ]
});

const config = {

  entry: [
    `./src/css/style.css`,
    `./src/js/script.js`
  ],

  resolve: {
    // import files without extension import ... from './Test'
    extensions: [`.js`, `.jsx`, `.css`]
  },

  output: {
    path: path.join(__dirname, `server`, `public`),
    filename: `js/[name].[hash].js`,
    publicPath
  },

  devtool: `sourcemap`,

  module: {

    rules: [
      {
        test: /\.css$/,
        loader: extractCSS.extract([
          {
            loader: `css`,
            options: {
              importLoaders: 1
            }
          },
          {
            loader: `postcss`
          }
        ])
      },
      {
        test: /\.html$/,
        loader: `html`,
        options: {
          attrs: [
            `audio:src`,
            `img:src`,
            `video:src`,
            `source:srcset`
          ] // read src from video, img & audio tag
        }
      },
      {
        test: /\.(jsx?)$/,
        exclude: /node_modules/,
        use: [
          {
            loader: `babel`
          },
          {
            loader: `eslint`,
            options: {
              fix: true
            }
          }
        ]
      },
      {
        test: /\.(svg|png|jpe?g|gif|webp)$/,
        loader: `url`,
        options: {
          limit: 1000, // inline if < 1 kb
          context: `./src`,
          name: `[path][name].[ext]`
        }
      },
      {
        test: /\.(mp3|mp4)$/,
        loader: `file`,
        options: {
          context: `./src`,
          name: `[path][name].[ext]`
        }
      }
    ]

  },

  plugins: [
    extractCSS,
    copy
  ]

};

if(process.env.NODE_ENV === `production`){

  //image optimizing
  config.module.rules.push({
    test: /\.(svg|png|jpe?g|gif)$/,
    loader: `image-webpack`,
    enforce: `pre`
  });

  config.plugins = [
    ...config.plugins,
    new UglifyJsPlugin({
      sourceMap: true, // false returns errors.. -p + plugin conflict
      comments: false
    })
  ];

}

config.plugins = [...config.plugins, ...configHtmls.plugins];

module.exports = config;

Answer 1

UglifyJs2 有一個 Harmony 分支，它接受要縮小的 ES6 語法。 此時，您需要創建一個 webpack 的 fork 並將 webpack 指向該 fork。

我最近回答了幾個類似的問題。 請查看#38387544或#39064441以獲取詳細說明。

Answer 2

OP 的錯誤來自 UglifyJs，已在接受的答案中解決，此頁面的某些人可能會從 babel 收到錯誤，在這種情況下，請使用以下方法修復它：將"presets": ["es2015"]到options.presets babel-loader 的部分，或者到.babelrc 。

Answer 3

就我而言，我使用的是 webpack 1.14 版，我從git ref那里得到了幫助

步驟：

1. 安裝yarn add uglifyes-webpack-plugin （並刪除yarn remove uglifyjs-webpack-plugin ）
2. 然后安裝yarn add uglify-js-es6
3. 在 webpack.config.js 文件new webpack.optimize.UglifyJsPlugin new UglifyJsPlugin更改為new UglifyJsPlugin

然后我就可以建造了。 謝謝