一直运行很好的项目突然build报错了,错误信息如下:
1 2 3 |
ERROR in static/js/vendor.f1c68aa2d5e85847d30e.js from UglifyJs Unexpected token name «i», expected punc «;» [./node_modules/element-ui/src/utils/merge.js:2,0][static/js/vendor.f1c68aa2d5e85847d30e.js:17064,11] Build failed with errors. |
在 UglifyJs 的 github issues #78 找到了这样一个解决方案:由于 UglifyJs 只支持 ES5 而 element-ui 可能引入了一部分 ES6 的写法,所以导致 webpack 打包失败。issue 里最后给出的解决方案是用 beta 版本的Uglify-es 来代替 UglifyJs(Beta 版本引入了对 ES2015+)的支持。需要在前端工作目录下用执行命令 npm i -D uglifyjs-webpack-plugin@beta。 不过在尝试过后,发现 build error 的问题依然没有解决,在深入查找问题所在后,决定用 bable 来解析 element-ui, 要完成此操作只需要修改前端文件夹下的build/webpack.base.conf.js 文件即可,修改如下: 修改前
1 2 3 4 5 6 7 8 |
module: { rules: [ ... { test: /\.js$/, loader: 'babel-loader', include: [resolve('src'), resolve('test')] }, |
修改后
1 2 3 4 5 6 7 8 9 |
module: { rules: [ ... { test: /\.js$/, loader: 'babel-loader',//注意elementUI的源码使用ES6需要解析 include: [resolve('src'), resolve('test'),resolve('/node_modules/element-ui/src'),resolve('/node_modules/element-ui/packages')] }, ... |
相当于将 element-ui 加入需要 babel 解析的包中。 之后再次执行 npm run build, build 成功。 转载自以下文章: 原文地址 from:https://blog.csdn.net/sing_sing/article/details/79146265
View Details