路由配置优化及页面元信息添加

src/router/index.ts

@@ -13,6 +13,11 @@ import { routes } from 'vue-router/auto-routes';
 // const Login = () => import("@/views/Login.vue");
 // const NotFound = () => import("@/views/NotFound.vue");
 
+routes.unshift({
+  path: "/",
+  redirect: "/home",
+});
+
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
   routes:routes as any

src/views/AppShare.vue

@@ -6,6 +6,12 @@
 </template>
 
 <script setup lang="ts">
+definePage({
+  name:'appshare',
+  meta: {
+    title: '软件分享',
+  }
+})
 // 软件分享页逻辑
 </script>
 

src/views/Article.vue

@@ -6,6 +6,12 @@
 </template>
 
 <script setup lang="ts">
+definePage({
+  name:'article',
+  meta: {
+    title: '文章',
+  }
+})
 // 文章页逻辑
 </script>
 

src/views/Gallery.vue

@@ -111,6 +111,15 @@ import tao from "@/assets/images/树枝桃.png";
 import denglong from "@/assets/images/灯笼.png";
 import { throttle } from 'es-toolkit';
 import { nextTick, onMounted, onUnmounted, ref } from 'vue';
+
+definePage({
+  name:'gallery',
+  meta: {
+    title: '画廊',
+  }
+})
+
+
 // 画廊页逻辑
 const tid = ref('share');
 const fileList = ref<any[]>([]);
@@ -195,12 +204,12 @@ function getImageSizeByCheck(url: string): any {
     image.src = url;
     let height = 0
     let width = 0
-    let timer = setInterval(() => {
+    let timer = setTimeout(() => {
       if (image.width > 0 && image.height > 0) {
         height = image.height
         width = image.width
         resolve({ height, width })
-        clearInterval(timer)
+        clearTimeout(timer)
       }
     }, 40)
   });

src/views/Home.vue

@@ -81,7 +81,10 @@
 import { getDictValue } from '@/util/index.ts'
 
 definePage({
-  name:'home'
+  name:'home',
+  meta: {
+    title: '首页',
+  }
 })
 
 // 新增导航弹窗

src/views/Login.vue

@@ -37,6 +37,12 @@
 </template>
 
 <script setup lang="ts">
+definePage({
+  name:'login',
+  meta: {
+    title: '登录',
+  }
+})
 
 const router = useRouter()
 // 登录注册逻辑

src/views/NotFound.vue

@@ -5,6 +5,12 @@
 </template>
 
 <script setup lang="ts">
+definePage({
+  name:'404',
+  meta: {
+    title: '错误',
+  }
+})
 // 404页面
 </script>
 

src/views/Plink.vue

@@ -6,6 +6,12 @@
 </template>
 
 <script setup lang="ts">
+definePage({
+  name:'plink',
+  meta: {
+    title: '友链',
+  }
+})
 // 友链页逻辑
 </script>
 

src/views/Widget.vue

@@ -6,6 +6,12 @@
 </template>
 
 <script setup lang="ts">
+definePage({
+  name:'widget',
+  meta: {
+    title: '工具',
+  }
+})
 // 工具页逻辑
 </script>
 

typed-router.d.ts

@@ -18,14 +18,14 @@ declare module 'vue-router/auto-routes' {
    * Route name map generated by unplugin-vue-router
    */
   export interface RouteNamedMap {
-    '/AppShare': RouteRecordInfo<'/AppShare', '/AppShare', Record<never, never>, Record<never, never>>,
+    'appshare': RouteRecordInfo<'appshare', '/AppShare', Record<never, never>, Record<never, never>>,
-    '/Article': RouteRecordInfo<'/Article', '/Article', Record<never, never>, Record<never, never>>,
+    'article': RouteRecordInfo<'article', '/Article', Record<never, never>, Record<never, never>>,
-    '/Gallery': RouteRecordInfo<'/Gallery', '/Gallery', Record<never, never>, Record<never, never>>,
+    'gallery': RouteRecordInfo<'gallery', '/Gallery', Record<never, never>, Record<never, never>>,
     'home': RouteRecordInfo<'home', '/Home', Record<never, never>, Record<never, never>>,
-    '/Login': RouteRecordInfo<'/Login', '/Login', Record<never, never>, Record<never, never>>,
+    'login': RouteRecordInfo<'login', '/Login', Record<never, never>, Record<never, never>>,
-    '/NotFound': RouteRecordInfo<'/NotFound', '/NotFound', Record<never, never>, Record<never, never>>,
+    '404': RouteRecordInfo<'404', '/NotFound', Record<never, never>, Record<never, never>>,
-    '/Plink': RouteRecordInfo<'/Plink', '/Plink', Record<never, never>, Record<never, never>>,
+    'plink': RouteRecordInfo<'plink', '/Plink', Record<never, never>, Record<never, never>>,
-    '/Widget': RouteRecordInfo<'/Widget', '/Widget', Record<never, never>, Record<never, never>>,
+    'widget': RouteRecordInfo<'widget', '/Widget', Record<never, never>, Record<never, never>>,
   }
 
   /**
@@ -40,15 +40,15 @@ declare module 'vue-router/auto-routes' {
    */
   export interface _RouteFileInfoMap {
     'src/views/AppShare.vue': {
-      routes: '/AppShare'
+      routes: 'appshare'
       views: never
     }
     'src/views/Article.vue': {
-      routes: '/Article'
+      routes: 'article'
       views: never
     }
     'src/views/Gallery.vue': {
-      routes: '/Gallery'
+      routes: 'gallery'
       views: never
     }
     'src/views/Home.vue': {
@@ -56,19 +56,19 @@ declare module 'vue-router/auto-routes' {
       views: never
     }
     'src/views/Login.vue': {
-      routes: '/Login'
+      routes: 'login'
       views: never
     }
     'src/views/NotFound.vue': {
-      routes: '/NotFound'
+      routes: '404'
       views: never
     }
     'src/views/Plink.vue': {
-      routes: '/Plink'
+      routes: 'plink'
       views: never
     }
     'src/views/Widget.vue': {
-      routes: '/Widget'
+      routes: 'widget'
       views: never
     }
   }

vite.config.ts

@@ -12,23 +12,24 @@ import vueDevTools from "vite-plugin-vue-devtools";
 import svgLoader from "vite-svg-loader";
 // https://vite.dev/config/
 export default defineConfig({
-  
   plugins: [
     vue(),
-    vueDevTools(),
+    
-    UnoCSS(),
+    VueRouter({
-    svgLoader(),
+      routesFolder: "src/views",
+    }),
     AutoImport({
       include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/, /\.md$/],
-      imports: ["vue", "pinia",VueRouterAutoImports],
+      imports: ["vue", "pinia", VueRouterAutoImports],
-    }),
-    VueRouter({
-      routesFolder:'src/views'
     }),
+    
     Components({
       resolvers: [DevUiResolver()],
-      dirs:['src/components']
+      dirs: ["src/components"],
     }),
+    UnoCSS(),
+    svgLoader(),
+    vueDevTools(),
   ],
   esbuild: {
     pure: ["console.log"], // 删除 console.log