路由模块化加载


1.在route文件夹下面新增路由模块,如login.router.js

 确保Login.vue这个组件存在

2在router下的主文件index.js中新增

//路由接收数组
const routerList = [];
//获取所有路由文件
function importRouterAll(r) {
  r.keys().forEach(function (key) {
    console.log(r(key));
    routerList.push(r(key).default);
  });
}
//动态引入所有...router.js文件
/*
  require.context()=>webpack API =>引入文件,动态引入
  参数:1路径  2是否匹配子集文件  3正则表达式,文件的名称
*/
importRouterAll(require.context("./", false, /\.router\.js/));

3将路由数组routerList 展开即可,此时所有的模块路由都是一级路由

相关