在vue + element-ui的項目中執(zhí)行 npm run build時出現(xiàn)以下異常。
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
異常出現(xiàn)原因
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的轉(zhuǎn)化
修改后的webpack.base.config.js
修改后重新 npm run build 結(jié)果
npm run build 成功打包
