項目壓縮打包時,出現如下問題:
ERROR in views/index/index.js from UglifyJs
Unexpected token: [./node_modules/pingyin/lib/index.js]
思路一:
pinyin模塊是es6編寫的,index.js文件應轉為es5。
es6轉es5的配置方法如下:
1、安裝webpack、babel-preset-es2015、label-loader模塊;
2、.babelrc文件寫入{ "presets": [ "es2015" ] };
3、webpack.config.js文件寫入標紅代碼:
module.exports = {
entry: {
"views/index/index"
},
output: {
path: path.resolve(__dirname, './dist'),
publicPath: '/dist/',
filename: '[name].js'
},
module: {
loaders: [{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/
}]
}
}
若以上均正確配置,依然報錯,推測與UglifyJsPlugin有關。UglifyJsPlugin插件只能壓縮打包es5文件
思路二:更換壓縮打包模塊
1、安裝如下模塊:
"uglify-js": "git://github.com/mishoo/UglifyJS2#harmony-v2.8.22",
"uglifyjs-webpack-plugin": “0.4.3",
注意:uglifyjs-webpack-plugin最新版本有問題,請安裝0.4.4版本以下
2、webpack.config.js文件寫入標紅代碼:
const UglifyJSPlugin = require(‘uglifyjs-webpack-plugin');
if (process.env.NODE_ENV === 'production') {
module.exports.devtool = '#source-map'
module.exports.plugins = (module.exports.plugins || []).concat([
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"'
}
}),
new UglifyJSPlugin({
sourceMap: true,
compress: {
warnings: false
}
}),
new webpack.LoaderOptionsPlugin({
minimize: true
})
])
}
