build: Add vite-plugin-html plugin

src/config/app.ts

@@ -48,7 +48,7 @@ export const appModules: AppState = {
   userInfo: 'userInfo', // 登录信息存储字段-建议每个项目换一个字段，避免与其他项目冲突
   sizeMap: ['default', 'large', 'small'],
   mobile: false, // 是否是移动端
-  title: 'ElementAdmin', // 标题
+  title: import.meta.env.VITE_APP_TITLE as string, // 标题
   pageLoading: false, // 路由跳转loading
 
   breadcrumb: true, // 面包屑

src/router/index.ts

@@ -33,6 +33,16 @@ export const constantRouterMap: AppRouteRecordRaw[] = [
       title: t('router.login'),
       noTagsView: true
     }
+  },
+  {
+    path: '/404',
+    component: () => import('@/views/Error/404.vue'),
+    name: 'NoFind',
+    meta: {
+      hidden: true,
+      title: '404',
+      noTagsView: true
+    }
   }
 ]
 

src/store/modules/permission.ts

@@ -60,18 +60,17 @@ export const usePermissionStore = defineStore({
         const routerMap: AppRouteRecordRaw[] = cloneDeep(asyncRouterMap)
 
         // 动态路由，404一定要放到最后面
-        this.addRouters = routerMap
-        // .concat([
-        //   {
-        //     path: '/:path(.*)*',
-        //     redirect: '/404',
-        //     name: '404',
-        //     meta: {
-        //       hidden: true,
-        //       breadcrumb: false
-        //     }
-        //   }
-        // ])
+        this.addRouters = routerMap.concat([
+          {
+            path: '/:path(.*)*',
+            redirect: '/404',
+            name: '404Page',
+            meta: {
+              hidden: true,
+              breadcrumb: false
+            }
+          }
+        ])
         // 渲染菜单的所有路由
         this.routers = cloneDeep(constantRouterMap).concat(routerMap)
         resolve()

src/views/Error/403.vue

@@ -13,5 +13,5 @@ const errorClick = () => {
 </script>
 
 <template>
-  <Error type="403" @errorClick="errorClick" />
+  <Error type="403" @error-click="errorClick" />
 </template>

src/views/Error/404.vue

@@ -13,5 +13,5 @@ const errorClick = () => {
 </script>
 
 <template>
-  <Error @errorClick="errorClick" />
+  <Error @error-click="errorClick" />
 </template>

src/views/Error/500.vue

@@ -13,5 +13,5 @@ const errorClick = () => {
 </script>
 
 <template>
-  <Error type="500" @errorClick="errorClick" />
+  <Error type="500" @error-click="errorClick" />
 </template>