vue3+vite(2.9.9)构建打包到线上环境时动态路由导入失败

最新推荐文章于 2025-08-06 20:00:00 发布

原创最新推荐文章于 2025-08-06 20:00:00 发布 · 647 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端

前言：当前项目包含了2个子项目，自己vite.config.ts与父级vite.config.ts有关联关系，声明别名时会导致整个项目报错，直接逻辑导入路径前缀会导致打包线上时找不到路由前面的路径，故而使用动态导入路径方式来处理。

1、本地运行好好的没问题，发版到线上就报下面错误

此处使用vite动态导入方式，import.meta.glob('../../../lib/saas/view/*.ts');

const modules2 = import.meta.glob('/src/view/**/*.vue');

const sessionStoreRoute = sessionStorage.getItem('dynamicRouteList');
const getDynamicRouteList = sessionStoreRoute ? JSON.parse(sessionStoreRoute) : [];
const dynamicRoute: any = [];
// 使用 import.meta.glob 动态导入所有视图组件
const modules = import.meta.glob('../../../lib/saas/view/*.ts');
const modules2 = import.meta.glob('/src/view/**/*.vue');
// getDynamicRouteList.map(itemRouter => {
//     if(itemRouter.children && itemRouter.children.length > 0){
//       itemRouter.children.map(childRoute => {
//         let modulePath0 = childRoute.component;
//         childRoute.component = () => new Function(`return import('/nerv-lib/saas/view/${modulePath0}')`)();///nerv-lib/saas/view/
//         if(childRoute.children && childRoute.children.length > 0){
//           childRoute.children.map(child2=>{
//             let modulePath = child2.component;
//             child2.component = () => new Function(`return import('/@/view/${modulePath}')`)();///@/view/
//           })
//         }else{//如没有下一级菜单代表是一级，重新处理一级菜单路由
//             childRoute.component = () => new Function(`return import('/@/view/${modulePath0}')`)();
//         }
//       })
//     }
//     dynamicRoute.push(itemRouter)
// })
getDynamicRouteList.forEach((itemRouter) => {
  if (itemRouter.children && itemRouter.children.length > 0) {
    itemRouter.children.forEach((childRoute) => {
      const modulePath0 = childRoute.component;
      // 修改 component 属性
      // childRoute.component = () => import(`${saasView}/${modulePath0}`).then((mod) => mod.default);
      // childRoute.component = () => new Function(`return import('${baseURL}${modulePath0}')`)();
      // (childRoute.component =
      //   modules[`../../../lib/saas/view/${modulePath0}`] ||
      //   (() => import(`../../../lib/saas/view/${modulePath0}`).then((mod) => mod.default)));
      childRoute.component = modules[`../../../lib/saas/view/${modulePath0}`];
      if (childRoute.children && childRoute.children.length > 0) {
        childRoute.children.forEach((child2) => {
          const modulePath = child2.component;
          // 修改 component 属性
          // child2.component =
          //   modules2[`./SaaS-lib/src/view/${modulePath}`] ||
          //   (() => import(`./SaaS-lib/src/view/${modulePath}`).then((mod) => mod.default));
          // child2.component = /* @vite-ignore */ () =>
          //   import(`/@/view/${modulePath}`).then((mod) => mod.default);
          // child2.component = () => new Function(`return import('${baseURL2}${modulePath}')`)();
          child2.component = modules2[`/src/view/${modulePath}`];
        });
      } else {
        // 如果没有下一级菜单代表是一级，重新处理一级菜单路由
        // childRoute.component = /* @vite-ignore */ () =>
        //   import(`/@/view/${modulePath0}`).then((mod) => mod.default);
        // childRoute.component = () => new Function(`return import('${baseURL2}${modulePath0}')`)();
        childRoute.component = modules2[`/src/view/${modulePath0}`];
        // modules2[`./SaaS-lib/src/view/${modulePath0}`] ||
        //   (() => import(`./SaaS-lib/src/view/${modulePath0}`).then((mod) => mod.default));
      }
    });
  }
  dynamicRoute.push(itemRouter);
});
export default dynamicRoute;