webpack打包报错UglifyJs Unexpected token: punc (,)

项目当dev命令运行时能正常运行,打包后却报错UglifyJs Unexpected token: punc (,),

javascript 复制代码
> yarn build
 
Creating an optimized production build...
Failed to compile.
 
Failed to minify the bundle. Error: static/js/main.js from UglifyJs
Unexpected token: punc (,) [static/js/main.js:11913,13]
    at /Users/busyRobot/workSpace/B/A/scripts/build.js:120:23
    at /Users/busyRobot/workSpace/B/A/node_modules/webpack/lib/Compiler.js:269:13
    at Compiler.emitRecords (/Users/busyRobot/workSpace/B/A/node_modules/webpack/lib/Compiler.js:375:38)
    at /Users/busyRobot/workSpace/B/A/node_modules/webpack/lib/Compiler.js:262:10
    at /Users/busyRobot/workSpace/B/A/node_modules/webpack/lib/Compiler.js:368:12
    at next (/Users/busyRobot/workSpace/B/A/node_modules/tapable/lib/Tapable.js:218:11)
    at Compiler.<anonymous> (/Users/busyRobot/workSpace/B/A/node_modules/webpack/lib/performance/SizeLimitsPlugin.js:99:4)
    at next (/Users/busyRobot/workSpace/B/A/node_modules/tapable/lib/Tapable.js:220:14)
    at /Users/busyRobot/workSpace/B/A/node_modules/sw-precache-webpack-plugin/lib/index.js:98:18
Read more here: http://bit.ly/2tRViJ9

但是能顺利打出来,看一下原webpack.prod.conf.js:

JavaScript 复制代码
 plugins: [
...
   new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: false
      },
      sourceMap: config.build.productionSourceMap,
      parallel: true
    }),
]

经过一番思考后对比其他项目打算换一个压缩插件uglifyjs-webpack-plugin,而不使用webpack内置插件,结果就解决了!

1.在package.json中添加如下插件依赖
"uglifyjs-webpack-plugin": "^1.1.1"

2.修改文件webpack.prod.conf.js, 替换webpack的压缩插件

JavaScript 复制代码
//文件开始处添加如下
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
//插件配置处添加如下
 plugins: [
...
    new UglifyJsPlugin({
      uglifyOptions: {
        compress: {
          warnings: false,
          drop_debugger: true, 
          drop_console: true 
        }
      },
      sourceMap: config.build.productionSourceMap,
      parallel: true
    }),
...
]

注意把之前的webpack配置的压缩插件注释了。

3.再次打包,成功了。

本文参考文章

相关推荐
bug总结4 分钟前
如何在 Vue.js 中集成 Three.js —— 创建一个旋转的 3D 立方体
前端·javascript·vue.js
不会飞的鲨鱼18 分钟前
【QQ音乐】sign签名| data参数加密 | AES-GCM加密 | webpack (下)
javascript·爬虫·python·webpack
J船长33 分钟前
Flutter,从Text 说起 立即调用函数表达式(IIFE)
前端
无名之逆2 小时前
[特殊字符]For Speed Enthusiasts: The Ultimate Evolution of Rust HTTP Engines
开发语言·前端·后端·网络协议·http·rust
巴巴_羊2 小时前
前端八股HTTP和https大全套
前端·http·https
不写八个3 小时前
Express教程【002】:Express监听GET和POST请求
前端·javascript·express
pianmian19 小时前
3D Tiles高级样式设置与条件渲染(3)
linux·服务器·前端
资深前端之路9 小时前
vue+threeJs 绘制3D圆形
前端·javascript·vue.js
Nymph_Zhu9 小时前
vue3+element-plus el-date-picker日期、年份筛选设置本周、本月、近3年等快捷筛选
前端·vue.js·elementui
极客密码10 小时前
DeepSeek-R1-0528,官方的端午节特别献礼
前端·ai编程·deepseek