在vue + element-ui的项目中执行 npm run build时出现以下异常。
npm run build报错.png
ERROR in static/js/0.b872446cd2a353bd1400.js from UglifyJs
Unexpected token: name (scrollBarWidth) [./~/element-ui/src/utils/scrollbar-widt
h.js:3,0][static/js/0.b872446cd2a353bd1400.js:96,4]
Build failed with errors.
npm info lifecycle task-system-admin@1.0.0~build: Failed to exec build script
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! task-system-admin@1.0.0 build: `node build/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the task-system-admin@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional log
ging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\bank_gz\AppData\Roaming\npm-cache\_logs\2018-08-27T03_28_2
0_039Z-debug.log
异常出现原因
1、element-ui中使用了es6 的语法，UglifyJs无法对 es6进行混淆压缩。
解决方法
1、在项目中找到 build/webpack.base. config.js文件
build/webpack.base.config.js在项目中的位置
2、打开文件，把 module 的 rules 的 test: /.js$/做出修改
// 修改前
rules: [
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test')]
]
// 修改后
rules: [
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test'),resolve('/node_modules/element-ui/src'),resolve('/node_modules/element-ui/packages')]
]
// 即把element-ui框架的源码进行 es6到 es5的转化
修改后的webpack.base.config.js
修改后重新 npm run build 结果
npm run build 成功打包
