生成 .map文件
1 .source map就是一个信息文件，里面存储着位置信息，也就是说，转换后的每一个位置，所对应的转换前的位置
2 .有了这个，出错的时候，出错工具将显示原始代码，而不是转换后的代码.可以像未加密的代码一样，准确知道是哪一行哪一行出的错
3 .不打包这个文件
productionSourceMap:false
路由懒加载
1 .把不同路由对应的组件分成不同的代码块，然后当路由被访问的时候在加载组件
查看打包文件结构和各种文件的比例
npm install --save-dev webpack-bundle-analyzer
2 .默认安装好了 npm run build --report 直接使用就可以
3 .# vue-cli 使用 webpack-bundle-analyzer还是不行。。
4 .这个插件可以用来定位问题，vue-cli可视化界面也没有这个可视化分析。
代码分割
1 .第三方项目按需加载
2 .组件按需加载
3 .浏览器缓存
1 .哪个模块更新了之后不用缓存，没更新的模块继续使用缓存
2 .https://juejin.im/post/5a337a1f6fb9a0452b4949e0#heading-5
4 .不要全局引入第三方库。在实际开发中，可能出现某个组件需要引入一个库的时候，而其他的组件根本使用不到
1 .如果全局引入的话，该库会合并在vender.js中，造成首屏加载缓慢
//具体代码如下
export default{
name:'',
beforeCreate(){
import('moment').then((m)=>{
this.moment=m
}),
data(){
return {
moment:null,
}
}
}
}
2 .这样就会使得moment库只在改组件使用处使用
3 .如果改组件是页面级别的组件，使用路由懒加载中的方法即可
改造vue-cli中webpack提升首页加载速度
1 .npm run build --report 查看打包分布图
2 .发现vender代码都打包在这里，框架代码是常变的，所以不需要每次打包，可以将它们提取出来，挂到cdn上面
3 .首屏问题最终方案还是SSR?
使用cdn外部加载
1 .echarts,可能没找到echarts的按需加载组件，这样我们可以通过使用外部引用的方式来减少编译的大小
2 .删除所有的import 方法，在webpack的设置中进行修改
3 .
基于webpack的优化
1 .https://juejin.im/entry/5996a90f6fb9a0247f4f37ac
2 .
打包Gzip文件
性能分析
1 .hiper工具测试
2 .https://github.com/pod4g/hiper/blob/master/README.zh-CN.md 文档
