react vite使用import.meta.glob批量导入路由方式
作者：初遇你时动了情
文章介绍了如何通过动态引入模块中的路由信息,简化了传统的路由管理方式,无需单独引入每个模块的路由
react vite使用import.meta.glob批量导入路由
//注意需要加入这个才能是同步，不然就是异步
const metaRouters:any = import.meta.glob("./modules/*.tsx",{ eager: true });
// 路由处理
export const routerArray: RouteObject[] = [];
for (const key in metaRouters) {
// 这个path当路由的path，引入文件不区分大小写，手动改首字母大写
// 根据自己的需要，自己组装path
// let path = key.split("/")[5];
// path =
// "/antd-doc/" + path.substring(0, 1).toLocaleUpperCase() + path.substring(1);
//这个是组件，可以直接使用
const component = metaRouters[key].default;
routerArray.push(...component);
}
目录
这样的话直接可以动态引入modules里面的路由信息，不用在单独引入了
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。