feat: 更新路由插件，重构路由获取逻辑并添加新的路由页面

index.html

@@ -84,6 +84,6 @@
         } catch (e) {}
       };
       s.parentNode.insertBefore(tk, s);
-    })(document);
+    }) /* (document) */;
   </script>
 </html>

src/layouts/sakai-vue/AppMenu.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { getRoutes } from '@/plugins/router';
+import { createGetRoutes } from '@/plugins/router';
 import type { MenuItem } from 'primevue/menuitem';
 import type { PanelMenuProps } from 'primevue/panelmenu';
 
@@ -13,7 +13,7 @@ const _generateMenuItems = (routes: RouteRecordRaw[]): PanelMenuProps['model'] =
 };
 
 const cmptItems = computed(() => {
-  return getRoutes()
+  return createGetRoutes(router)()
     .filter((route) => !route.path.includes('/:'))
     .map((route, index) => {
       return {

src/pages/router.page.vue

@@ -0,0 +1,56 @@
+<script setup lang="ts">
+import { createGetRoutes, setupLayoutsResult } from '@/plugins/router';
+import { routes } from 'vue-router/auto-routes';
+const router = useRouter();
+
+const list = [
+  {
+    title: 'routes',
+    json: routes,
+  },
+  {
+    title: 'setupLayoutsResult',
+    json: setupLayoutsResult,
+  },
+  {
+    title: 'createGetRoutes(router)()',
+    json: createGetRoutes(router)().map((route) => ({
+      ...route,
+      instances: undefined,
+      leaveGuards: undefined,
+      updateGuards: undefined,
+      enterCallbacks: undefined,
+      components: undefined,
+    })),
+  },
+  // {
+  //   title: 'createGetRoutes(router, true)()',
+  //   json: createGetRoutes(router, true)(),
+  // },
+  {
+    title: 'router.getRoutes()',
+    json: router.getRoutes().map((route) => ({
+      ...route,
+      instances: undefined,
+      leaveGuards: undefined,
+      updateGuards: undefined,
+      enterCallbacks: undefined,
+      components: undefined,
+    })),
+  },
+];
+</script>
+<template>
+  <Tabs :value="list[0].title">
+    <TabList>
+      <Tab v-for="item in list" :key="item.title" :value="item.title">{{ item.title }}</Tab>
+    </TabList>
+    <TabPanels>
+      <TabPanel v-for="item in list" :key="item.title" :value="item.title">
+        <pre>{{ item.json }}</pre>
+      </TabPanel>
+    </TabPanels>
+  </Tabs>
+</template>
+
+<style scoped></style>

src/pages/use-second-layout-1/index.page.vue

@@ -1,11 +0,0 @@
-<template>
-  <div>src/pages/use-second-layout-1/index.page.vue</div>
-</template>
-
-<script setup lang="ts"></script>
-
-<style scoped></style>
-<route lang="yaml">
-meta:
-  layout: second
-</route>

src/pages/use-second-layout-2.page.vue

@@ -1,11 +0,0 @@
-<template>
-  <div>src/pages/use-second-layout-2.page.vue</div>
-</template>
-
-<script setup lang="ts"></script>
-
-<style scoped></style>
-<route lang="yaml">
-meta:
-  layout: second
-</route>

src/plugins/router.ts

@@ -3,10 +3,10 @@ import { createGetRoutes, setupLayouts } from 'virtual:meta-layouts';
 // import { createGetRoutes, setupLayouts } from 'virtual:generated-layouts';
 import { createRouter, createWebHistory } from 'vue-router/auto';
 import { handleHotUpdate, routes } from 'vue-router/auto-routes';
-
+const setupLayoutsResult = setupLayouts(routes);
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
-  routes: /* routes ?? */ setupLayouts(routes),
+  routes: /* routes ?? */ setupLayoutsResult,
   strict: true,
   scrollBehavior: (_to, _from, savedPosition) => {
     if (savedPosition) {
@@ -16,28 +16,19 @@ const router = createRouter({
     }
   },
 });
-const getRoutes = createGetRoutes(router);
 if (import.meta.hot) handleHotUpdate(router);
 if ($__DEV__) Object.assign(window, { router });
 router.onError((error) => {
   console.debug('🚨 [router error]: ', error);
 });
 
-export { getRoutes, router };
+export { router, setupLayoutsResult, createGetRoutes };
 export function install({ app }: { app: import('vue').App<Element> }) {
   app
     // Register the plugin before the router
     .use(DataLoaderPlugin, { router })
     // adding the router will trigger the initial navigation
     .use(router);
-  if ('2' === ('1' as never)) {
-    const getRoutes = createGetRoutes(router);
-    const setupLayoutsResult = setupLayouts(routes);
-
-    console.debug(`routes :>> `, routes);
-    console.debug(`getRoutes() :>> `, getRoutes()); // 获取路由表但是不包含布局路由
-    console.debug(`setupLayoutsResult :>> `, setupLayoutsResult);
-  }
 }
 // ========================================================================
 // =========================== Router Guards ==============================

typed-router.d.ts

@@ -31,10 +31,9 @@ declare module 'vue-router/auto-routes' {
     'InfiniteLoading': RouteRecordInfo<'InfiniteLoading', '/infinite-loading', Record<never, never>, Record<never, never>>,
     'MdPage': RouteRecordInfo<'MdPage', '/md-page', Record<never, never>, Record<never, never>>,
     'Primevue': RouteRecordInfo<'Primevue', '/primevue', Record<never, never>, Record<never, never>>,
+    'Router': RouteRecordInfo<'Router', '/router', Record<never, never>, Record<never, never>>,
     'SomePage': RouteRecordInfo<'SomePage', '/some-page', Record<never, never>, Record<never, never>>,
     'TsEnumUtil': RouteRecordInfo<'TsEnumUtil', '/ts-enum-util', Record<never, never>, Record<never, never>>,
-    'UseSecondLayout1': RouteRecordInfo<'UseSecondLayout1', '/use-second-layout-1', Record<never, never>, Record<never, never>>,
-    'UseSecondLayout2': RouteRecordInfo<'UseSecondLayout2', '/use-second-layout-2', Record<never, never>, Record<never, never>>,
     'VueMacrosDefineRender': RouteRecordInfo<'VueMacrosDefineRender', '/vue-macros/DefineRender', Record<never, never>, Record<never, never>>,
     'VueMacrosReactivityTransform': RouteRecordInfo<'VueMacrosReactivityTransform', '/vue-macros/ReactivityTransform', Record<never, never>, Record<never, never>>,
     'VueMacrosReusableTemplate': RouteRecordInfo<'VueMacrosReusableTemplate', '/vue-macros/ReusableTemplate', Record<never, never>, Record<never, never>>,

vite.config.ts

@@ -32,7 +32,12 @@ export default defineConfig(({ mode, command }) => {
           if (warning.code === 'EVAL' && warning.id?.includes('node_modules/mockjs')) return;
           warn(warning);
         },
-        output: env.VITE_SPLIT_CHUNKS === 'true' ? createSplitChunkOutput() : undefined,
+
+        // https://cn.rollupjs.org/configuration-options/#output-assetfilenames
+        // output: env.VITE_SPLIT_CHUNKS === 'true' ? (await import('utils4u/rollup')).createSplitChunkOutput() : undefined,
+        output: {
+          minifyInternalExports: false,
+        },
       },
     },
   };