性能优化
1.路由懒加载
import Home from '@/views/pages/home.vue'; //可修改为： const Home = import('@/views/pages/home.vue');
2.组件懒加载
import C from '@/components/C.vue'; //可修改为： const C = import('@/components/C.vue');
此时，使用到组件C的js中都不会包含组件C的代码，组件C会被打包成一个独立的js，只会在用户触发了加载组件的行为时，才会去加载c.js和c.css。
但是，使用组件懒加载需要一些前提条件，例如：
1）该页面的 JS 文件体积大，导致页面打开慢，可以通过组件懒加载进行资源拆分，利用浏览器并行下载资源，提升下载速度（比如首页）
2）该组件不是一进入页面就展示，需要一定条件下才触发（比如弹框组件）
3）该组件复用性高，很多页面都有引入，利用组件懒加载抽离出该组件，一方面可以很好利用缓存，同时也可以减少页面的 JS 文件大小（比如表格组件、图形组件等）
资源拆分过细也并不一定能提升性能，因为它会造成浏览器http请求变多。需要结合实际情况做取舍。
3.tree-shaking
tree shaking 的作用：消除无用的 JS 代码，减少代码体积.
tree-shaking 原理：
依赖于ES6的模块特性，ES6模块依赖关系是确定的，和运行时的状态无关，可以进行可靠的静态分析，这就是 tree-shaking 的基础
静态分析就是不需要执行代码，就可以从字面量上对代码进行分析。ES6之前的模块化，比如 CommonJS 是动态加载，只有执行后才知道引用的什么模块，就不能通过静态分析去做优化，正是基于这个基础上，才使得 tree-shaking 成为可能
Tree shaking 并不是万能的
export default 导出的是一个对象，无法通过静态分析判断出一个对象的哪些变量未被使用，所以 tree-shaking 只对使用 export 导出的变量生效。
