当打包构建应用时，Javascript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。
// 将
// import UserDetails from './views/UserDetails'
// 替换成
const UserDetails = () => import('./views/UserDetails')
官方文档：https://router.vuejs.org/zh/guide/advanced/lazy-loading.html
例如：
import Vue from 'vue'
import Router from 'vue-router'
const Index = () => import('@/components/Index')//异步按需引入
Vue.use(Router)
const router = new Router({
routes: [
{
path: '/',
name: 'Index',
component: Index,//使用引入
}
]
})
如遇报错需使用bable路由懒加载插件syntax-dynamic-import
npm install --save-dev babel-plugin-syntax-dynamic-import
配置.babelrc文件（若没有，则新建这个文件，和package.json同级）
{
"plugins": ["syntax-dynamic-import"]
}
再次打包
npm run build
会发现根目录dist>static>js由一个较大的js文件变为了更多js文件，此时再访问会按需加载路由对应js，从而提高加载速度。
来自：http://www.qubiancheng1024.com/details/623fcbd88fe8934aa4300898
