与其说是优化 Vue，不如说主要是在 webpack 打包的配置中做些文章，使得 Vue 编译后的文件尽可能的小。以下介绍自己在项目中进行优化的过程，其中的内容也许并不适合于每个项目，但整体思路是差不多的。
定位问题
要想进行优化，首先我们得清楚问题所在。即：是哪些代码/依赖包导致最后的编译文件过大？
这里，我们需要使用
webpack-bundle-analyzer 工具。修改
package.json 文件，添加：
"analyze": "NODE_ENV=production npm_config_report=true npm run build"然后执行：
npm run analyze便会在浏览器中打开一个页面，展示编译后的文件大小及各部分内容大小。以下是项目在优化前的分析结果：
从图中可以看出，最后编译出的
vendor.js 文件达到了 5MB，其中主要来自
echarts。此外，由于
element-ui 在使用时已经注意到按需加载组件，所以可优化的部分不多；而
lodash 由于没有按需加载，所以成为需要优化的另一个核心部分。使用按需加载优化
这里主要是对
lodash 进行优化。当我们在使用
lodash 时，如果使用：
import _ from 'lodash'_.get(obj, 'key', 'default_value')
这种方式的话，则在编译时会默认将
lodash 的全部内容进行编译打包。webpack 的介绍中确实提到了按需加载，但这个概念可能会出现理解上的偏差，下面我们举例说明：
// 方法一：会导致加载全部的 lodash 库
import _ from 'lodash'
_.get()// 方法二：只会加载其中的 get 方法
import get from 'lodash/get'
get()
即在不添加其他插件和配置的情况下，webpack 还做不到如此智能。
想要实现在使用方法一的情况下，也能按照我们使用过的方法真正「按需加载」，则需要使用插件并添加配置：
首先执行：
npm i --save-dev babel-plugin-lodash babel-cli babel-preset-es2015然后修改
.babelrc：
{
"plugins": ["lodash"],
