npm install时UglifyJs报错：Unexpected token keyword，求解决方案

嘿，这个报错我太熟了！确实是因为UglifyJS（旧版）只能处理ES5语法，而你的ES6代码没被Babel正确转译导致的。我给你列几个最常见的排查和解决步骤，你挨个试试：

• 先确认Babel核心依赖有没有装全
  别漏了关键的包：@babel/core、@babel/preset-env和babel-loader。直接在终端跑这个命令补装：

  npm install @babel/core @babel/preset-env babel-loader --save-dev
  

• 检查Babel配置是否生效
  项目根目录的.babelrc或者babel.config.js得正确配置preset-env，比如这样写：

  {
    "presets": [
      ["@babel/preset-env", {
        "targets": {
          "browsers": ["last 2 versions", "ie >= 11"]
        }
      }]
    ]
  }
  

  要是你直接在Webpack配置里写Babel规则，记得把preset配置进去：

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

• 换掉旧版UglifyJs，用TerserPlugin
  旧版uglifyjs-webpack-plugin不支持ES6，Webpack 4+其实默认已经用terser-webpack-plugin替代它了，如果你还在手动用旧版，赶紧换：
  先安装：

  npm install terser-webpack-plugin --save-dev
  

  然后在Webpack配置里配置它：

  const TerserPlugin = require('terser-webpack-plugin');
  
  module.exports = {
    optimization: {
      minimizer: [new TerserPlugin()]
    }
  };
  

• 排查有没有漏转译的文件
  看看Webpack的loader规则：exclude是不是不小心把需要转译的文件排除了？test的正则有没有覆盖到你所有的JS文件（比如用了.jsx的话要改成/\.jsx?$/）？另外，如果某个依赖包本身用了ES6语法，可能得把它从exclude里去掉，让Babel也处理这个依赖。

• 确认构建命令是否正确
  看看package.json里的scripts，比如npm run build对应的命令是不是正确调用了Webpack的生产模式：

  "scripts": {
    "build": "webpack --mode production"
  }
  

如果试完这些还是没解决，把你的完整package.json和Webpack配置文件贴出来，我再帮你精准定位问题！

内容的提问来源于stack exchange，提问作者cph2117