Vue 懒加载问题

Question

系统有很多路由，已经均使用import设置了懒加载，如下：

[{
 path: '/index',
 name: 'home',
 component: () => import('@/views/home/index.vue'),
 children:[
      { 
         name: 'syslog',
         path: '/log/syslog/detail',
         component: () => import(/* webpackChunkName:"syslogDetail" */'@/views/sysDetail.vue')
       },
       { 
         name: 'snmp',
         path: '/log/snmptrap/detail',
         component: () => import(/* webpackChunkName: "snmpDetail" */'@/views/trapDetail.vue')
       }]
}]

但在系统运行时和打包后发现，页面并没有如想象的切换对应路由时才加载对应的js,而是加载首页时加载了全部的js。另外按照上面设置的部分路由又是切换路由才加载了对应的文件，经测试发现，懒加载貌似与文件大小有关系，文件大于43kb左右时，就会进入首页就加载全部文件。请问是哪里还需要设置什么东西么？按理说只要采用懒加载就应该都是切换路由才会加载文件呀？

Answer 1

首先需要确认下打包后dist/js下面的js是否是根据路由中webpackChunkName命名生成，然后就是router.js中\* webpackChunkName: "syslogDetail" \*/是否是多个名称而不是所有的路由webpackChunkName都是"
syslogDetail"。