refactor: 更改 svg icons 目录结构

src/main.ts

@@ -5,7 +5,6 @@ import { router } from "@/router"
 import { createApp } from "vue"
 import "@/router/permission"
 // load
-import { loadSvg } from "@/assets/icons"
 import { loadDirectives } from "@/directives"
 import { loadPlugins } from "@/plugins"
 // css
@@ -21,8 +20,6 @@ const app = createApp(App)
 
 // 加载插件
 loadPlugins(app)
-// 加载全局 SVG
-loadSvg(app)
 // 加载自定义指令
 loadDirectives(app)
 

src/plugins/element-plus-icons/index.ts

@@ -1,7 +1,7 @@
 import type { App } from "vue"
 import * as ElementPlusIconsVue from "@element-plus/icons-vue"
 
-export function loadElementPlusIcon(app: App) {
+export function loadElementPlusIcons(app: App) {
   // 注册所有 Element Plus Icon
   for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
     app.component(key, component)

src/plugins/index.ts

@@ -1,10 +1,12 @@
 import type { App } from "vue"
 import { loadElementPlus } from "./element-plus"
-import { loadElementPlusIcon } from "./element-plus-icon"
+import { loadElementPlusIcons } from "./element-plus-icons"
+import { loadSvgIcons } from "./svg-icons"
 import { loadVxeTable } from "./vxe-table"
 
 export function loadPlugins(app: App) {
   loadElementPlus(app)
-  loadElementPlusIcon(app)
+  loadElementPlusIcons(app)
   loadVxeTable(app)
+  loadSvgIcons(app)
 }

src/plugins/svg-icons/index.ts

@@ -2,6 +2,6 @@ import type { App } from "vue"
 import SvgIcon from "@/components/SvgIcon/index.vue" // Svg Component
 import "virtual:svg-icons-register"
 
-export function loadSvg(app: App) {
+export function loadSvgIcons(app: App) {
   app.component("SvgIcon", SvgIcon)
 }

types/vue-router.d.ts

@@ -9,7 +9,7 @@ declare module "vue-router" {
      */
     title?: string
     /**
-     * 设置该路由的图标，记得将 svg 导入 @/assets/icons/svg
+     * 设置该路由的图标，记得将 svg 导入 @/assets/icons
      */
     svgIcon?: string
     /**

vite.config.ts

@@ -91,7 +91,7 @@ export default defineConfig(({ mode }) => {
       svgLoader({ defaultImport: "url" }),
       // 生成 SVG 雪碧图
       createSvgIconsPlugin({
-        iconDirs: [resolve(root, "src/assets/icons/svg")],
+        iconDirs: [resolve(root, "src/assets/icons")],
         symbolId: "icon-[dir]-[name]"
       }),
       // 原子化 CSS