uglifyjs-webpack-plugin报错ERROR in bundle.js from UglifyJs Unexpected token: name «str», expected:

原创于 2020-01-08 13:44:18 发布 · 3.1k 阅读

0 ·

CC 4.0 BY-SA版权

webpack 专栏收录该内容

14 篇文章

订阅专栏

本文介绍如何使用UglifyJS-webpack-plugin压缩代码时，因无法解析ES6语法导致的错误。通过安装并配置Babel-loader，实现Webpack正确打包ES6语法的代码。

1、下载

npm i -D uglifyjs-webpack-plugin

2、在webpack.config.js

const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 
module.exports = {
  mode: 'production',
  optimization: {
    minimizer: [new UglifyJsPlugin()],
  },
};

此时运行npx webpack 或者 npm run build，会报错

ERROR in bundle.js from UglifyJs
Unexpected token: name «str»...

因为UglifyJs不能解析es6语法，所以要安装babel解析

3、安装babel-loader

npm install -D babel-loader @babel/core @babel/preset-env

4、wepack.config.js

module: {
  rules: [
    {
      test: /\.m?js$/,
      exclude: /node_modules/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['@babel/preset-env']
        }
      }
    }
  ]
}