标签：org group mod code optimize height 模块 inf 文件
webpack4版本前，可以使用webpack内置的JS插件CommonsChunkPlugin来提取第三方库和公共模块,避免首屏加载的bundle文件或者按需加载的bundle文件体积过大，从而导致加载时间过长.具体设置如下：
webpack.config.js
module.exports = { entry: { app: path.join(__dirname, ‘./src/main.js‘), vendors:[‘jquery‘] //把要抽离的第三方包的名称，放到这个数组中 }, output: { path: path.join(__dirname, ‘./dist‘), filename: ‘js/bundle.js‘ }, plugins:[ new webpack.optimize.CommonsChunkPlugin({ name:’vendors’, // 指定要抽离的入口名称 filename:’js/vendors.js’ //将来再发布的时候，除了会有一个bundle.js，还会多一个vendor.js文件，里面存放了所有的第三方包 }) ] }
更多具体设置，可查看：https://segmentfault.com/a/1190000012828879?utm_source=tag-newest
webpack4版本，已经不用webpack.optimize.CommonsChunkPlugin。如果引用，会报下面的错。
可以在optimization.splitChunks中设置
module.exports = { entry: { app: path.join(__dirname, ‘./src/main.js‘), vendors:[‘vue‘,‘vue-router‘] //把要抽离的第三方包的名称，放到这个数组中 }, output: { path: path.join(__dirname, ‘./dist‘), filename: ‘js/bundle.js‘ }, module:{}, plugins:[], optimization: { minimizer: [new UglifyJsPlugin()], splitChunks: { cacheGroups: { commons: { name: ‘commons‘,//commons里面的name就是生成的共享模块bundle的名字 chunks: ‘all‘, minChunks: 2 } } } } }
具体配置，可以查看：https://webpack.js.org/plugins/split-chunks-plugin/
webpack--webpack.optimize.CommonsChunkPlugin has been removed, please use config.o
标签：org group mod code optimize height 模块 inf 文件
原文地址：https://www.cnblogs.com/Super-scarlett/p/12333331.html
