Vue路由懒加载（解决首页加载过慢）

Vue-router+webpack配合
在路由中
const aaa = () => import(/webpackChunkName : “随便名字”/ “@/view/index即路径”)
webpackcName一样的会打包到同一文件中
const bbb= () => import(/webpackChunkName : “随便名字”/ “@/view/index即路径”)
export default new Router({
router : [{
path : “/”,
name : “aaa”,
component:aaa
},
{
path : “/”,
name : “bbb”,
component:bbb
}
]})
或者直接把路由写成resolve
routers = [
{ path: ‘/’, name: ‘index’, component: (resolve) => require([’./views/index.vue’], resolve) } ]

第三种
const Index = r => require.ensure([], () => r(require(’./views/index’)), ‘group-home’);
const routers = [ { path: ‘/’, name: ‘index’, component: Index } ]

group-home是可以将多个组件都放到一个组里

在webpack.base,conf.js文件中的output配置chunkFileName,即最终打包的名字