学习blog：Vue实现路由懒加载以及将组件打包到一个模块中

目前Vue Router官方推荐的懒加载形式是这样

const Foo = () => import('./Foo.vue')

const router = new VueRouter({
  routes: [
    { path: '/foo', component: Foo }
  ]
})

当然你也可以直接这么写

const router = new VueRouter({
  routes: [
    { path: '/foo', component: () => import('./Foo.vue') }
  ]
})

如果我们想要把几个路由对应的组件打包合并到一个模块里，
那我们就需要通过Magic Comments（魔法注释）进行命名

 }, {
   path: '/main/manager/index',
   name: 'ManagerIndex',
   component: () => import(/* webpackChunkName:'manager'*/ '@/components/manager')
 }, {
   path: '/main/manager/payment',
   name: 'ManagerPayment',
   component: () => import(/* webpackChunkName:'manager'*/ '@/components/manager/payment')
 }, {
   path: '/main/manager/income',
   name: 'ManagerIncome',
   component: () => import(/* webpackChunkName:'manager'*/ '@/components/manager/income')
 }, {
   path: '/main/manager/pay',
   name: 'ManagerPay',
   component: () => import(/* webpackChunkName:'manager'*/ '@/components/manager/pay')
 }, {
   path: '/main/manager/situation',
   name: 'ManagerSituation',
   component: () => import(/* webpackChunkName:'manager'*/ '@/components/manager/situation')
 }, {
   path: '/main/manager/live',
   name: 'ManagerLive',
   component: () => import(/* webpackChunkName:'manager'*/ '@/components/manager/live')
 }, {

比如说我想把有关manager的组件都打包到一个chunk里

这样就实现了组件的合并