路由的懒加载方式

        路由懒加载的好处：当打包构建应用时，JavaScript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。

如图所示：

import Vue from 'vue'
import Router from 'vue-router'
import home from '../view/home/home'
import fenlei from '../view/fenlei/fenlei'
import gouwuche from '../view/gouwuche/gouwuche'
import geren from '../view/geren/geren'

以上则是正常的使用import来进行组件的导入，这样会使得页面加载缓慢，js包会变得很大。所以最好的方式则是对路由进行懒加载方式，但需要跳转到要用的页面的时候在对该页面进行加载，这样大大提高了效率。

如图所示;

const home = ()=> import('../view/home/home')
const fenlei = ()=> import('../view/fenlei/fenlei')
const gouwuche = ()=> import('../view/gouwuche/gouwuche')
const geren = ()=> import('../view/geren/geren')

这种方法则是使用懒加载方式,是ES6方式的懒加载，还有vue异步组件加载，

如图：

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export default new Router({
  routes: [{
      // 进行路由配置,规定'/'引入到home组件
      path: '/',
      name: 'Home',
      component: resolve => require(['../pages/Home.vue'], resolve),
      meta: {
        title: 'home'
      }
    },
    {
      path: '/about',
      name: 'About',
      component: resolve => require(['../pages/About.vue'], resolve)
    }
  ]
})