From 69c7415aeab707b564344a5fcc40c88608230f3d Mon Sep 17 00:00:00 2001 From: rd <1344903914@qq.com> Date: Fri, 18 Jul 2025 11:08:09 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=8E=BB=E9=99=A4unplugin-icons?= =?UTF-8?q?=E6=8F=92=E4=BB=B6=E7=9B=B8=E5=85=B3=E9=80=BB=E8=BE=91=EF=BC=8C?= =?UTF-8?q?=E5=BC=95=E5=85=A5vite-plugin-svg-icons=E6=8F=92=E4=BB=B6?= =?UTF-8?q?=E5=B0=81=E8=A3=85SvgIcon=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/index.ts | 2 +- config/unplugin/auto-import.ts | 8 ----- config/unplugin/component.ts | 6 ---- config/unplugin/icons.ts | 24 ++++++------- package.json | 1 + ...lution.svg => svg-intelligentSolution.svg} | 0 ...-mediaAccount.svg => svg-mediaAccount.svg} | 0 ...icon-putAccount.svg => svg-putAccount.svg} | 0 ...icon-repository.svg => svg-repository.svg} | 0 src/assets/svg/svg-taskCenter.svg | 3 ++ .../navbar/components/right-side/index.vue | 4 +-- src/components/svg-icon/index.vue | 35 +++++++++++++++++++ src/main.ts | 13 +++++-- .../routes/modules/propertyMarketing.ts | 8 ++--- tsconfig.json | 2 +- 15 files changed, 69 insertions(+), 37 deletions(-) rename src/assets/svg/{icon-intelligentSolution.svg => svg-intelligentSolution.svg} (100%) rename src/assets/svg/{icon-mediaAccount.svg => svg-mediaAccount.svg} (100%) rename src/assets/svg/{icon-putAccount.svg => svg-putAccount.svg} (100%) rename src/assets/svg/{icon-repository.svg => svg-repository.svg} (100%) create mode 100644 src/assets/svg/svg-taskCenter.svg create mode 100644 src/components/svg-icon/index.vue diff --git a/config/index.ts b/config/index.ts index 58a9509..5c96895 100644 --- a/config/index.ts +++ b/config/index.ts @@ -1,5 +1,5 @@ import { configUnocss } from './plugins'; -import { configAutoImport, configComponents, configIcons } from './unplugin'; +import { configAutoImport, configComponents,configIcons } from './unplugin'; import viteCompression from 'vite-plugin-compression'; import progress from 'vite-plugin-progress'; import defineOptions from 'unplugin-vue-define-options/vite'; diff --git a/config/unplugin/auto-import.ts b/config/unplugin/auto-import.ts index 6d2de4c..5617d5a 100644 --- a/config/unplugin/auto-import.ts +++ b/config/unplugin/auto-import.ts @@ -1,14 +1,9 @@ -/* - * @Author: RenXiaoDong - * @Date: 2025-06-24 16:29:10 - */ /** * 自动引入API * */ import AutoImport from 'unplugin-auto-import/vite'; import { ArcoResolver } from 'unplugin-vue-components/resolvers'; -import IconsResolver from 'unplugin-icons/resolver'; import { layoutsResolver } from '../utils'; @@ -31,9 +26,6 @@ export function configAutoImport() { enable: true, }, }), - IconsResolver({ - enabledCollections: [], - }), layoutsResolver(), ], eslintrc: { diff --git a/config/unplugin/component.ts b/config/unplugin/component.ts index 9840799..57b9dc8 100644 --- a/config/unplugin/component.ts +++ b/config/unplugin/component.ts @@ -5,7 +5,6 @@ import { kebabCase } from 'unplugin-vue-components'; import Components from 'unplugin-vue-components/vite'; import { ArcoResolver } from 'unplugin-vue-components/resolvers'; -import IconsResolver from 'unplugin-icons/resolver'; import { getSep, getPath, setResolve, layoutsResolver } from '../utils'; @@ -20,11 +19,6 @@ export function configComponents() { }, sideEffect: true, }), - IconsResolver({ - prefix: false, - customCollections: ['i'], - enabledCollections: [], - }), layoutsResolver(), { type: 'component', diff --git a/config/unplugin/icons.ts b/config/unplugin/icons.ts index 2afaffa..0c94bf2 100644 --- a/config/unplugin/icons.ts +++ b/config/unplugin/icons.ts @@ -1,14 +1,14 @@ -/** - * 自动引入 svg 图标 - * */ -import Icons from 'unplugin-icons/vite'; -import { FileSystemIconLoader } from 'unplugin-icons/loaders'; +// /** +// * 自动引入 svg 图标 +// * */ +import { resolve } from '../utils'; + +import { createSvgIconsPlugin } from "vite-plugin-svg-icons"; export function configIcons() { - return Icons({ - compiler: 'vue3', - customCollections: { - i: FileSystemIconLoader('./src/assets', (svg) => svg.replace(/^ + + \ No newline at end of file diff --git a/src/components/_base/navbar/components/right-side/index.vue b/src/components/_base/navbar/components/right-side/index.vue index 6bada4f..8fb744d 100644 --- a/src/components/_base/navbar/components/right-side/index.vue +++ b/src/components/_base/navbar/components/right-side/index.vue @@ -1,7 +1,7 @@ + + + \ No newline at end of file diff --git a/src/main.ts b/src/main.ts index 9ce866e..bab185a 100644 --- a/src/main.ts +++ b/src/main.ts @@ -5,18 +5,25 @@ import App from './App.vue'; import router from './router'; import store from './stores'; -import NoData from '@/components/no-data'; -import '@/api/index'; +import NoData from '@/components/no-data'; +import SvgIcon from "@/components/svg-icon"; + +import '@/api/index'; import '@arco-design/web-vue/dist/arco.css'; // Arco 默认样式 import './core'; import 'normalize.css'; import 'uno.css'; +import 'virtual:svg-icons-register' + // import '@/styles/vars.css'; // 优先加载 const app = createApp(App); + +app.component('NoData', NoData); +app.component('SvgIcon', SvgIcon); + app.use(store); app.use(router); -app.component('NoData', NoData); app.mount('#app'); diff --git a/src/router/routes/modules/propertyMarketing.ts b/src/router/routes/modules/propertyMarketing.ts index 58e5ed4..048a3d2 100644 --- a/src/router/routes/modules/propertyMarketing.ts +++ b/src/router/routes/modules/propertyMarketing.ts @@ -5,10 +5,10 @@ import type { AppRouteRecordRaw } from '../types'; import { MENU_GROUP_IDS } from '@/router/constants'; -import IconRepository from '@/assets/svg/icon-repository.svg'; -import IconMediaAccount from '@/assets/svg/icon-mediaAccount.svg'; -import IconPutAccount from '@/assets/svg/icon-putAccount.svg'; -import IconIntelligentSolution from '@/assets/svg/icon-intelligentSolution.svg'; +import IconRepository from '@/assets/svg/svg-repository.svg'; +import IconMediaAccount from '@/assets/svg/svg-mediaAccount.svg'; +import IconPutAccount from '@/assets/svg/svg-putAccount.svg'; +import IconIntelligentSolution from '@/assets/svg/svg-intelligentSolution.svg'; const COMPONENTS: AppRouteRecordRaw[] = [ { diff --git a/tsconfig.json b/tsconfig.json index 448577a..8d7756e 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -16,7 +16,7 @@ "paths": { "@/*": ["src/*"] }, - "types": ["unplugin-icons/types/vue", "unplugin-vue-define-options/macros-global"] + "types": ["unplugin-vue-define-options/macros-global"] }, "references": [