refactor: ♻️ 统一注册vue插件

src/lang/index.ts

@@ -1,3 +1,4 @@
+import type { App } from "vue";
 import { createI18n } from "vue-i18n";
 import { useAppStoreHook } from "@/store/modules/app";
 // 本地语言包
@@ -22,4 +23,9 @@ const i18n = createI18n({
   globalInjection: true,
 });
 
+// 全局注册 i18n
+export function setupI18n(app: App<Element>) {
+  app.use(i18n);
+}
+
 export default i18n;

src/main.ts

@@ -1,9 +1,6 @@
 import { createApp } from "vue";
 import App from "./App.vue";
-import router from "@/router";
-import { setupStore } from "@/store";
-import { setupDirective } from "@/directive";
-import { setupElIcons, setupI18n, setupPermission } from "@/plugins";
+import setupPlugins from "@/plugins";
 
 // 本地SVG图标
 import "virtual:svg-icons-register";
@@ -15,14 +12,5 @@ import "uno.css";
 import "animate.css";
 
 const app = createApp(App);
-// 全局注册 自定义指令(directive)
-setupDirective(app);
-// 全局注册 状态管理(store)
-setupStore(app);
-// 全局注册Element-plus图标
-setupElIcons(app);
-// 国际化
-setupI18n(app);
-// 注册动态路由
-setupPermission();
-app.use(router).mount("#app");
+app.use(setupPlugins);
+app.mount("#app");

src/plugins/i18n.ts

@@ -1,7 +0,0 @@
-// 国际化
-import i18n from "@/lang/index";
-import type { App } from "vue";
-
-export function setupI18n(app: App<Element>) {
-  app.use(i18n);
-}

src/plugins/index.ts

@@ -1,3 +1,24 @@
-export * from "./icons";
-export * from "./i18n";
-export * from "./permission";
+import { setupDirective } from "@/directive";
+import { setupI18n } from "@/lang";
+import { setupRouter } from "@/router";
+import { setupStore } from "@/store";
+import type { App } from "vue";
+import { setupElIcons } from "./icons";
+import { setupPermission } from "./permission";
+
+export default {
+  install(app: App<Element>) {
+    // 自定义指令(directive)
+    setupDirective(app);
+    // 路由(router)
+    setupRouter(app);
+    // 状态管理(store)
+    setupStore(app);
+    // 国际化
+    setupI18n(app);
+    // Element-plus图标
+    setupElIcons(app);
+    // 路由守卫
+    setupPermission();
+  },
+};

src/router/index.ts

@@ -1,3 +1,4 @@
+import type { App } from "vue";
 import { createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router";
 
 export const Layout = () => import("@/layout/index.vue");
@@ -117,6 +118,11 @@ const router = createRouter({
   scrollBehavior: () => ({ left: 0, top: 0 }),
 });
 
+// 全局注册 router
+export function setupRouter(app: App<Element>) {
+  app.use(router);
+}
+
 /**
  * 重置路由
  */