perf: 路由重构

src/router/elegant/transform.ts

@@ -11,26 +11,22 @@ import type { RouteMap, RouteKey, RoutePath } from '@elegant-router/types';
  * transform elegant const routes to vue routes
  * @param routes elegant const routes
  * @param layouts layout components
- * @param views view components
  */
 export function transformElegantRoutesToVueRoutes(
   routes: ElegantConstRoute[],
   layouts: Record<string, RouteComponent | (() => Promise<RouteComponent>)>,
-  views: Record<string, RouteComponent | (() => Promise<RouteComponent>)>
 ) {
-  return routes.flatMap(route => transformElegantRouteToVueRoute(route, layouts, views));
+  return routes.flatMap(route => transformElegantRouteToVueRoute(route, layouts ));
 }
 
 /**
  * transform elegant route to vue route
  * @param route elegant const route
  * @param layouts layout components
- * @param views view components
  */
 function transformElegantRouteToVueRoute(
   route: ElegantConstRoute,
   layouts: Record<string, RouteComponent | (() => Promise<RouteComponent>)>,
-  views: Record<string, RouteComponent | (() => Promise<RouteComponent>)>
 ) {
   const LAYOUT_PREFIX = 'layout.';
   const VIEW_PREFIX = 'view.';
@@ -48,7 +44,7 @@ function transformElegantRouteToVueRoute(
       throw new Error(`Layout component "${layout}" not found`);
     }
 
-    return layout;
+    return layouts[layout];
   }
 
   function isView(component: string) {
@@ -57,12 +53,14 @@ function transformElegantRouteToVueRoute(
 
   function getViewName(component: string) {
     const view = component.replace(VIEW_PREFIX, '');
-
-    if(!views[view]) {
+    debugger
+    const v = findView(view)
+    console.log(v)
+    if(!v) {
       throw new Error(`View component "${view}" not found`);
     }
 
-    return view;
+    return v;
   }
 
   function isFirstLevelRoute(item: ElegantConstRoute) {
@@ -97,51 +95,47 @@ function transformElegantRouteToVueRoute(
     if (component) {
       if (isSingleLevelRoute(route)) {
         const { layout, view } = getSingleLevelRouteComponent(component);
-  
+
         const singleLevelRoute: RouteRecordRaw = {
           path,
-          component: layouts[layout],
+          component: layout,
           children: [
             {
               name,
               path: '',
-              component: views[view],
+              component: view,
               ...rest
             } as RouteRecordRaw
           ]
         };
-  
+
         return [singleLevelRoute];
       }
-  
+
       if (isLayout(component)) {
-        const layoutName = getLayoutName(component);
-  
-        vueRoute.component = layouts[layoutName];
+        vueRoute.component = getLayoutName(component);
       }
-  
+
       if (isView(component)) {
-        const viewName = getViewName(component);
-  
-        vueRoute.component = views[viewName];
+        vueRoute.component = getViewName(component);
       }
-  
+
     }
   } catch (error: any) {
     console.error(`Error transforming route "${route.name}": ${error.toString()}`);
     return [];
   }
 
-  
+
   // add redirect to child
   if (children?.length && !vueRoute.redirect) {
     vueRoute.redirect = {
       name: children[0].name
     };
   }
-  
+
   if (children?.length) {
-    const childRoutes = children.flatMap(child => transformElegantRouteToVueRoute(child, layouts, views));
+    const childRoutes = children.flatMap(child => transformElegantRouteToVueRoute(child, layouts));
 
     if(isFirstLevelRoute(route)) {
       vueRoute.children = childRoutes;
@@ -155,6 +149,34 @@ function transformElegantRouteToVueRoute(
   return vueRoutes;
 }
 
+/**匹配views里面所有的.vue或.tsx文件 */
+const views = import.meta.glob('./../../views/**/*.{vue,tsx}');
+
+/**
+ * 查找页面模块
+ *
+ * 查找 `/views/system/menu/index.vue` 或 `/views/system/menu/index.tsx`
+ *
+ * 参数值为 `system/menu/index`
+ *
+ * @param dirName 组件路径
+ * @returns 路由懒加载函数
+ */
+function findView(dirName: string) {
+  for (const dir in views) {
+    let viewDirName = '';
+    const component = dir.match(/views\/(.+)\.(vue|tsx)/);
+    if (component && component.length === 3) {
+      viewDirName = component[1];
+    }
+    viewDirName = viewDirName.replaceAll("/", "_").replace("_index", "")
+    if ( viewDirName === dirName) {
+      return () => views[dir]();
+    }
+  }
+  return () => import("@/views/_builtin/404/index.vue");
+}
+
 /**
  * map of route name and route path
  */
@@ -181,15 +203,6 @@ const routeMap: RouteMap = {
   "function_toggle-auth": "/function/toggle-auth",
   "home": "/home",
   "login": "/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?",
-  "manage": "/manage",
-  "manage_dept": "/manage/dept",
-  "manage_dict": "/manage/dict",
-  "manage_menu": "/manage/menu",
-  "manage_post": "/manage/post",
-  "manage_role": "/manage/role",
-  "manage_route": "/manage/route",
-  "manage_user": "/manage/user",
-  "manage_user-detail": "/manage/user-detail/:id",
   "user-center": "/user-center"
 };
 
@@ -198,6 +211,7 @@ const routeMap: RouteMap = {
  * @param name route name
  */
 export function getRoutePath<T extends RouteKey>(name: T) {
+  console.log(name)
   return routeMap[name];
 }