1、问题:
TypeError: Failed to fetch dynamically imported module:
2、原因:
动态路由页面引入并不是像静态引入一样写在router.ts文件中,所以在打包的时候,这些vue文件被忽略了,没有打包过去,所以加载失败
3、解决方案:
使用vite官网提供的动态导入方式:const modules = import.meta.glob('./dir/*.js')后面的地址是一个模板对应你前端的文件路径
例如:我前端对应的路径
../views/home/index.vue
在router.ts文件中写入
const modules = import.meta.glob("../views/**/**.vue")
//使用 添加动态路由
menus.forEach((item: any) => {
router.addRoute("Home", {
component: modules[`${item.component}`],
name: item.name,
path: item.path,
meta: item.meta,
})
})