其他回答《你值得了解的VIM中文乱码的问题（分享）》中，来给大家了解到了VIM中文乱码问题。下边本文来给大家掌握webpack3升级成webpack4版本号遇到的困难，小伙伴们来了解一下吧。
听说webpack3比webpack4编译程序速率接近快啦 60%-80%。
完成更新以后，因此来记录下来，新项目通常是vue ^2.5.9，webpack ^4.10.2，webpack-dev-sever ^3.1.4，相互配合提升的也有vue-loader ^15
新项目再现编译程序以后从原来的1.7MB降低到1.1MB，看起来在缩小这方面也是由功效的。
必须改动的地区主要有以下几个：
vue-loader14到15需要增加如下所示配备
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin') // webpack 4
const ExtractTextPlugin = require('extract-text-webpack-plugin') //for webpack3 -----
module.exports = {
...
plugins: [
new VueLoaderPlugin(),
new MiniCssExtractPlugin({filename:'mian.css'}) //for webpack 4
- new ExtractTextPlugin({filename:'main.css'}) //for webpack 3 ---
]
...
}webpack-dev-server更新以后需做如下所示修改
devServer: {
contentBase: path.resolve(__dirname, '../dos-html'), // 必须特定途径
port: 7001,
hot: true,
// open: false,
inline: true,
compress: true,
historyApiFallback: true,
....
},webpack3更新4以后必须修改的配备
plugins: [
//早已清除
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: function (module) {
// any required modules inside node_modules are extracted to vendor
return (
module.resource && /\.js$/.test(module.resource) &&
module.resource.indexOf( path.join(__dirname, '../node_modules')) === 0
)
}
}),
new webpack.optimize.UglifyJsPlugin(...）//早已清除
}
// ===> 调整为下列
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
moudel.exports = {
mode: 'production', 这儿特定方式。
...
optimization: {
splitChunks: {
name(module) {
return (
module.resource && /\.js$/.test(module.resource) &&
module.resource.indexOf(path.join(__dirname, '../node_modules')) === 0
)
}
},
minimize: true,
minimizer: [
new UglifyJsPlugin({
uglifyOptions: {
compress: {
warnings: false,
// drop_debugger: true,
// drop_console: true
},
sourceMap: false
}
})
]
},
...
}别的的各类出错信息内容，仔细看，有可能是控制模块版本号非常低吧，都更新会就OK了。
【完】
强烈推荐学习培训：Web pack入门视频教程
以上就是关于分析webpack3升级成webpack4版本号遇到的困难（汇总）的具体内容，大量欢迎关注AdminJS其他类似文章！