按需引用外部组件Referondemand2.启用happypack多核构建project3。修改source-map配置启用DllPlugin和DllReferencePlugin预编译库文件1.按需引用1.1几乎所有的第三方组件框架都会提供组件的按需引用方式。以iview为例，通过使用插件babel-plugin-import，可以按需加载组件，减小文件体积。只需要修改.babelrc文件npminstallbabel-plugin-import--save-dev//.babelrc{"plugins":[["import",{"libraryName":"iview","libraryDirectory":"src/components"}]]}1.2然后按需导入组件可以减少Import{Button}from'iview'Vue.component('Table',Table)2.启用happypack多核构建项目安装happypack后，修改/build/webpack.base.conf.js文件到npminstallhappypack--save-dev///build/webpack.base.conf.jsconstHappyPack=require('happypack')constos=require('os')consthappyThreadPool=HappyPack.ThreadPool({size:os.cpus().length})//添加HappyPack插件plugins:[newHappyPack({id:'happy-babel-js',loaders:['babel-loader?cacheDirectory=true'],threadPool:happyThreadPool,})]//修改importloader{test:/\.js$/,//loader:'babel-loader',loader:'happypack/loader?id=happy-babel-js',//添加新的HappyPackbuildloaderinclude:[resolve('src'),resolve('test')]}实现js缓存webpack插件CommonsChunkPlugin主要作用是提取public的webpack项目入口chunk部分，具体用法就不过多介绍了。不太了解的可以参考webpack官网的介绍；该插件是webpack项目常用的优化功能，几乎每个webpack项目都会用到使用该插件的好处：webpack入口，减少代码量；同时提高webpack打包速度。利用缓存机制：依赖的公共模块文件一般很少或从不更改，这样提取出来的独立模块文件可以长期缓存。但是在项目中，如果插件的打开方式不正确，上面的第二点其实是无法实现的，因为在这种情况下：未修改的公共代码或库代码打包的EntryChunk会随着其他业务代码的变化而变化，导致页面上的长缓存机制失效。那么，让我们开始正确的打开CommonsChunkPlugin的方法吧。
