webpack2 - webpack中的CommonsChunkPlugin配置问题

问题描述

问 题

entry: {
    'main': './main.js',
    'vendor': ['vue', 'vue-resource', 'vue-router', 'vuex']
},
plugins: [
    new webpack.optimize.CommonsChunkPlugin({ name: 'vendor', filename: 'js/vue-family.js' }),
    new webpack.optimize.CommonsChunkPlugin({ name: 'manifest', minChunks: Infinity })
]

webpack的部分配置如上，第一个CommonsChunkPlugin是把vue全家桶单独打包出来，那第二个是什么意思？求解。

解决方案

mainifest是存放一些运行时的代码，webpack每次运行都会产生一些运行时代码，如果只生成一个文件的时候都会打包进一个js，当单抽出vendor后，会将这些代码放入vendor中，但这样的话每次打包vendor的hash值都会变，起不到缓存的作用，所以将这些代码放入到mainifest中，是为了vendor更好的被缓存。虽然每次mainifest都会变，但这样的收益是比放入一个vendor中要大的多。

这篇关于webpack2 - webpack中的CommonsChunkPlugin配置问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！