webpack中mainifest.js vendor.js app.js 三者的区别

场景：

你们在利用构建工具进行应用最后的打包过程当中，咱们但愿作到的是将业务代码和第三方引用模块代码分开打包.

由于第三方引用模块代码一般很大，并且在不引入新的模块以前基本上是不会变更的。因此咱们须要将这部分独

立打包，并利用浏览器的缓存去提升应用程序的首屏加载速度。

 

因此咱们利用CommonsChunkPlugin插件去抽取这些第三方的部分做为vendor.js独立打包，由于须要利用到

缓存。因此咱们添加hash值不能在未改变的状况下更新，不然独立打包vendor.js就没有意义了。

 

改变的缘由：

webpack 打包后会在build过程当中产生Runtime的部分（运行时的一部分代码）会被添加进入vendor.js中，这是根本缘由

module.exports = {

　　　　　　output: {
　　　　　　　　path: config.build.assetsRoot,
　　　　　　　　filename: utils.assetsPath('js/[name].[chunkhash].js'),
　　　　　　　　chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
　　　　　　},

        plugins:[
            new webpack.optimize.CommonsChunkPlugin({
                names: ['vendor', 'manifest']
            }),
        ]
    ...
}

解决方法和你们说的都差很少，主要就是将Runtime的部分code抽到manifest.js中，我这里就是说一下为何这样作的缘由

至于app.js 就是app.vue或者其它相似vue文件的js业务代码