fix: 修复 RouteMeta 字段不完整的问题

src/router/index.ts

@@ -1,8 +1,9 @@
-import { createRouter, createWebHashHistory, createWebHistory, RouteRecordRaw } from "vue-router"
+import { createRouter, createWebHashHistory, createWebHistory } from "vue-router"
+import type { RouteRecordRaw } from "vue-router"
 const Layout = () => import("@/layout/index.vue")
 
 /** 常驻路由 */
-export const constantRoutes: Array<RouteRecordRaw> = [
+export const constantRoutes: RouteRecordRaw[] = [
   {
     path: "/redirect",
     component: Layout,
@@ -138,7 +139,7 @@ export const constantRoutes: Array<RouteRecordRaw> = [
  * 用来放置有权限 (Roles 属性) 的路由
  * 必须带有 Name 属性
  */
-export const asyncRoutes: Array<RouteRecordRaw> = [
+export const asyncRoutes: RouteRecordRaw[] = [
   {
     path: "/permission",
     component: Layout,
@@ -220,7 +221,7 @@ export function resetRouter() {
       }
     })
   } catch (error) {
-    // 强制刷新浏览器，不过体验不是很好
+    // 强制刷新浏览器也行，只是交互体验不是很好
     window.location.reload()
   }
 }

types/shims-app.d.ts

@@ -1,9 +0,0 @@
-declare module "*.svg"
-declare module "*.png"
-declare module "*.jpg"
-declare module "*.jpeg"
-declare module "*.gif"
-declare module "*.bmp"
-declare module "*.tiff"
-declare module "*.yaml"
-declare module "*.json"

types/shims-vue.d.ts

@@ -4,15 +4,6 @@ declare module "*.vue" {
   export default component
 }
 
-declare module "*.gif" {
-  export const gif: any
-}
-
-declare module "*.svg" {
-  const content: any
-  export default content
-}
-
 declare module "*.scss" {
   const scss: Record<string, string>
   export default scss

types/vue-proptery.d.ts

@@ -1,14 +0,0 @@
-import { ElMessage } from "element-plus"
-
-declare module "@vue/runtime-core" {
-  interface ComponentCustomProperties {
-    $message: ElMessage
-  }
-}
-
-declare module "vue-router" {
-  interface RouteMeta {
-    roles?: string[]
-    activeMenu?: string
-  }
-}

types/vue-router.d.ts

@@ -0,0 +1,41 @@
+import 'vue-router'
+
+declare module "vue-router" {
+  interface RouteMeta {
+    /**
+     * 设置该路由在侧边栏和面包屑中展示的名字
+     */
+    title?: string
+    /**
+     * 设置该路由的图标，记得将 svg 导入 @/icons/svg
+     */
+    icon?: string
+    /**
+     * 默认 false，设置 true 的时候该路由不会在侧边栏出现
+     */
+    hidden?: boolean
+    /**
+     * 设置该路由进入的权限，支持多个权限叠加
+     */
+    roles?: string[]
+    /**
+     * 默认 true，如果设置为 false，则不会在面包屑中显示
+     */
+    breadcrumb?: boolean
+    /**
+     * 默认 false，如果设置为 true，它则会固定在 tags-view 中
+     */
+    affix?: boolean
+    /**
+     * 当一个路由下面的 children 声明的路由大于 1 个时，自动会变成嵌套的模式
+     * 只有一个时，会将那个子路由当做根路由显示在侧边栏
+     * 若想不管路由下面的 children 声明的个数都显示你的根路由
+     * 可以设置 alwaysShow: true，这样就会忽略之前定义的规则，一直显示根路由
+     */
+    alwaysShow?: boolean
+    /**
+     * 当设置了该属性，进入路由时，则会高亮 activeMenu 属性对应的侧边栏
+     */
+    activeMenu?: string
+  }
+}