这篇文章运用简单易懂的例子给大家介绍vue打包时出现报错Unexpected token: punc怎么解决，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。
项目中有一个功能模块是使用Vue写的，然后蛋疼的来了，写Vue的同事走了，今天需要改，懵逼状态啊，这是什么？代码还没看懂，就给我出了一个Exception。记录一下，蛋疼历程。
ERROR in static/js/app.33254a875dd731a0b538.js from UglifyJs
Unexpected token: punc (() [./src/mixin/mixin.js:6,8][static/js/app.33254a875dd731a0b538.js:13,19]
好看不？
各种百度啊，有人说，下载新的vue-cli，webpack项目,拷贝.babelrc文件到原项目根目录下
然后再百度，怎么下载vue-cli，更刺激的来了，根本看不懂，一堆cmd，对于一个小白来说，简直残忍啊。
最后找到了一个大神的回复，懒惰的我，当然选择粘贴复制嘞。
解决方案：
1.在工程目录下新建.babelrc文件，注意文件类型选择File就可以了
2.cv大法（懒人专用）
{
"presets": [
["env", {
"modules": false,
"targets": {
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
}
}],
"stage-2"
],
"plugins": ["transform-runtime"],
"env": {
"test": {
"presets": ["env", "stage-2"],
"plugins": ["istanbul"]
}
}
}3.此时npm run build, ok了。
贴个完整的图片：
补充知识：webpack 打包时，代码压缩，删除console与注释
如下所示：
new webpack.optimize.UglifyJsPlugin({
//删除注释
output:{
comments:false
},
//删除console 和 debugger 删除警告
compress:{
warnings:false,
drop_debugger:true,
drop_console:true
}
})uglifyJsPlugin 用来对js文件进行压缩，减小js文件的大小。其会拖慢webpack的编译速度，建议开发环境时关闭，生产环境再将其打开。
vue cli 3.0中, 在vue.config.js中配置
configureWebpack:{
optimization: {
minimizer: [
new UglifyJsPlugin({
uglifyOptions: {
// 删除注释
output:{
comments:false
},
// 删除console debugger 删除警告
compress: {
warnings: false,
drop_console: true,//console
drop_debugger: false,
pure_funcs: ['console.log']//移除console
}
}
})
]
}
}运行出现报错 UglifyJs
DefaultsError: warnings is not a supported option
降低版本(使用 "uglifyjs-webpack-plugin": "^1.1.1")，打包正常，效果达到
关于vue打包时出现报错Unexpected token: punc怎么解决就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
