UglifyJs报Unexpected token punc «:», expected punc «,» 这类错误的解决办法-优快云博客

本文分享了一种解决Vue项目打包时出现Unexpected token punc «:», expected punc «,»错误的方法，通过配置webpack的uglifyjs-webpack-plugin插件的exclude选项，排除特定的js文件，从而帮助开发者定位并解决问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

起因是打包vue的项目。然后报出了这个错误。关键他并没有明确的说明是哪里报错。只是提示了Unexpected token punc «:», expected punc «,» [static/js/app.28653113.js:4107,15]，只说是在这个文件里面。but，打包没通过。这个文件根本就没有啊。。有时候报错是Unexpected token punc «:», expected punc «,» [./src/utils/request.js:8,11][static/js/app.28653113.js:4107,15]，这种明确提示了文件的还好排查。如果遇到上面的报错。咋搞。经过我一晚上的努力。终于找出一个解决这类问题的通用方法。

首先我们查看webpack的文档。发现uglifyjs-webpack-plugin这个插件有个exclude配置。即配置的文件都会被压缩插件排除，那么排除这个生成的js文件。我们不就能获得打包的项目，然后就可以排查问题了噻，实际操作如下。

针对低版本的vue-cli，这个时候还能看得到配置。我们找到build目录下的webpack.prod.conf.js文件，找到

minimizer: [
      new UglifyJsPlugin({
        sourceMap: true,
        uglifyOptions: {
          ecma: 8,
          compress: {
            warnings: false
          }
        }
      }),
      // Compress extracted CSS. We are using this plugin so that possible
      // duplicated CSS from different components can be deduped.
      new OptimizeCSSAssetsPlugin()
    ]

如上这段代码。。题外话。webpack4才有minimizer这个配置。低版本应该是没有的。然后我们加上exclude选项，并且包含报错的文件：

minimizer: [
      new UglifyJsPlugin({
       
        sourceMap: true,
        uglifyOptions: {
          ecma: 8,
          compress: {
            warnings: false
          }
        }
      }),
      // Compress extracted CSS. We are using this plugin so that possible
      // duplicated CSS from different components can be deduped.
      new OptimizeCSSAssetsPlugin()
    ]

排除掉上面一直报错的这个文件，其他参数可以忽略。主要是exclude，打包就能顺利通过，结果如下



然后我们就可以去刚刚一直报错的文件里面找为啥报错。我这里报错的是app.28653113.js的第4107行15列，也就是报错提示上的【static/js/app.28653113.js:4107,15】分号后面的两个数字，找到4107行，结果如下


因为安全问题。我把url改成了xxxx。但是错误是很明显的。对象的value本来应该是个字符串。所以才会一直报这个错。然后这个设置也很好找。就在config里面。当然其他人的错和我这个应该不会都一样。但是定位到问题，就好解决了。这个问题真是坑了我一一晚上
好惨。。。

转载于:https://www.cnblogs.com/yuweia/p/10521102.html