多个vue子路由文件自动化合并的方法

1. 目录结构

废话不多说，直接上图。

目录结构，如下图所示

2. 代码编写位置

在router目录下面的index.js文件中写入以下代码

import vue from 'vue'
import router from 'vue-router'
   
vue.use(router)
   
let routes = []
   
const routercontext = require.context('./', true, /index\.js$/)
   
routercontext.keys().foreach(route => {
 // 如果是根目录的 index.js、 不做任何处理   
 if (route.startswith('./index')) {
  return
 }     
 const routermodule = routercontext(route)   
 // 兼容 import export 和 require module.export 两种规范 es modules commonjs
 routes = [...routes, ...(routermodule.default || routermodule)]  
})
     
export default new router({
 mode: 'history',
 base: process.env.base_url,
 routes: routes
})

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对的支持。