vue自动加载模块方法require.context

大家在写vue路由的时候，一般会采取什么样的方法呢？在router的index.js中直接把路由写完，还是把每个页面抽出来再到router的index.js里引入？

两种好像都停麻烦，第一种页面多了都聚合在一个js文件里，不利于管理。第二种虽然抽离了每个页面的路由，但是每个都要在router中import，页面多了，就会麻烦。

node.js里面的一种方法可以很好应用在路由以及其他加载模块的需求上，require.context()

这是我的路由文件结构

其中文件夹里的indexs.js是对应页面的路由文件，注意是indexs，因为

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

Vue.use(Router);

let routers = [];
const routerContext = require.context('./', true, /indexs\.js$/);
routerContext.keys().forEach(route => {
  if (route.startsWith('./index')) {
    return;
  }
  const routerModule = routerContext(route);
  routers = [...routers, ...(routerModule.default || routerModule)];
});

export default new Router({
  routes: routers
});

我在router/index.js里面写的是require.context('./', true, /indexs\.js$/);第一个参数是路径，第二个参数是否深度遍历，去把文件夹里的文件夹的符合要求文件也找出来，第三个参数是正则表达式，你要查哪种文件。

第一个参数我写的是./当前的router文件，如果正则里是index，它也会去找到router/index.js这个文件，所以我把文件名改成了indexs，文件名无所谓的，主要是统一就行