webpack版本升级报错:
webpack.optimize.CommonsChunkPlugin has been removed,please use config.optimization.splitChunks instead.
原因分析:
webpack4 移除了 CommonsChunkPlugin,所以对配置文件要做做相应的修改。
解决办法:
1、注释或者删除配置文件中CommonsChunkPlugin插件相关的配置。
2、添加optimization配置。optimization位置在plugins、output同一级节点。
optimization: {
runtimeChunk: {
name: 'manifest'
},
splitChunks: {
maxInitialRequests: 10,
cacheGroups: {
common: {
name: 'common',
}
}
}
},
最终效果:
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
optimization: {
runtimeChunk: {
name: 'manifest'
},
splitChunks: {
maxInitialRequests: 10,
cacheGroups: {
common: {name: 'common'}
}
}
},
plugins: [
new webpack.DefinePlugin({
'process.env': env
}),
new VueLoaderPlugin(),
new UglifyJsPlugin({
uglifyOptions: {
compress: {
warnings: false
}
},
sourceMap: config.build.productionSourceMap,
parallel: true
}),
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].[chunkhash].css'),
allChunks: true,
}),
new OptimizeCSSPlugin({
cssProcessorOptions: config.build.productionSourceMap ? {
safe: true,
map: {inline: false},
autoprefixer: false
} : {safe: true}
}),
new HtmlWebpackPlugin({
filename: config.build.index,
title: 'minzuUniversityII' + timeStamp,
template: 'index.html',
favicon: 'src/assets/images/login/favicon.png',
inject: true,
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true
},
chunksSortMode: 'dependency'
})
]
项目打包正常