diff --git a/build/optimize.ts b/build/optimize.ts index fbf706efb..a93266420 100644 --- a/build/optimize.ts +++ b/build/optimize.ts @@ -57,8 +57,8 @@ const include = [ /** * 在预构建中强制排除的依赖项 - * 温馨提示：所有以 `@iconify-icons/` 开头引入的的本地图标模块，都应该加入到下面的 `exclude` 里，因为平台推荐的使用方式是哪里需要哪里引入而且都是单个的引入，不需要预构建，直接让浏览器加载就好 + * 温馨提示：所有以 `@iconify-json/` 开头引入的的本地图标模块，都应该加入到下面的 `exclude` 里，因为平台推荐的使用方式是哪里需要哪里引入而且都是单个的引入，不需要预构建，直接让浏览器加载就好 */ -const exclude = ["@iconify-icons/ep", "@iconify-icons/ri"]; +const exclude = ["@iconify-json/ep", "@iconify-json/ri"]; export { include, exclude }; diff --git a/build/plugins.ts b/build/plugins.ts index ea8bbc3d3..3cfd321ee 100644 --- a/build/plugins.ts +++ b/build/plugins.ts @@ -3,6 +3,7 @@ import vue from "@vitejs/plugin-vue"; import { pathResolve } from "./utils"; import { viteBuildInfo } from "./info"; import svgLoader from "vite-svg-loader"; +import Icons from "unplugin-icons/vite"; import type { PluginOption } from "vite"; import vueJsx from "@vitejs/plugin-vue-jsx"; import { configCompressPlugin } from "./compress"; @@ -57,6 +58,11 @@ export function getPluginsList( }), // svg组件化支持 svgLoader(), + // 自动按需加载图标 + Icons({ + compiler: "vue3", + scale: 1 + }), VITE_CDN ? cdn : null, configCompressPlugin(VITE_COMPRESSION), // 线上环境删除console diff --git a/package.json b/package.json index 43f1a7db5..51383d83e 100644 --- a/package.json +++ b/package.json @@ -119,8 +119,9 @@ "@commitlint/types": "^19.5.0", "@eslint/js": "^9.20.0", "@faker-js/faker": "^9.5.0", - "@iconify-icons/ep": "^1.2.12", - "@iconify-icons/ri": "^1.2.10", + "@iconify-json/ep": "^1.2.2", + "@iconify-json/ri": "^1.2.5", + "@iconify/utils": "^2.3.0", "@iconify/vue": "4.2.0", "@intlify/unplugin-vue-i18n": "^6.0.3", "@types/codemirror": "^5.60.15", @@ -166,6 +167,7 @@ "svgo": "^3.3.2", "tailwindcss": "3.4.17", "typescript": "^5.7.3", + "unplugin-icons": "^22.1.0", "vite": "^6.1.0", "vite-plugin-cdn-import": "^1.0.1", "vite-plugin-compression": "^0.5.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9312023a3..c8401903f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -219,12 +219,15 @@ importers: '@faker-js/faker': specifier: ^9.5.0 version: 9.5.0 - '@iconify-icons/ep': - specifier: ^1.2.12 - version: 1.2.12 - '@iconify-icons/ri': - specifier: ^1.2.10 - version: 1.2.10 + '@iconify-json/ep': + specifier: ^1.2.2 + version: 1.2.2 + '@iconify-json/ri': + specifier: ^1.2.5 + version: 1.2.5 + '@iconify/utils': + specifier: ^2.3.0 + version: 2.3.0 '@iconify/vue': specifier: 4.2.0 version: 4.2.0(vue@3.5.13(typescript@5.7.3)) @@ -360,6 +363,9 @@ importers: typescript: specifier: ^5.7.3 version: 5.7.3 + unplugin-icons: + specifier: ^22.1.0 + version: 22.1.0(@vue/compiler-sfc@3.5.13) vite: specifier: ^6.1.0 version: 6.1.0(@types/node@20.17.19)(jiti@2.4.2)(sass@1.85.0)(yaml@2.7.0) @@ -401,6 +407,12 @@ packages: resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==} engines: {node: '>=6.0.0'} + '@antfu/install-pkg@1.0.0': + resolution: {integrity: sha512-xvX6P/lo1B3ej0OsaErAjqgFYzYVcJpamjLAFLYh9vRJngBrMoUG7aVnrGTeqM7yxbyTD5p3F2+0/QUEh8Vzhw==} + + '@antfu/utils@8.1.1': + resolution: {integrity: sha512-Mex9nXf9vR6AhcXmMrlz/HVgYYZpVGJ6YlPgwl7UnaFpnshXs6EK/oa5Gpf3CzENMjkvEx2tQtntGnb7UtSTOQ==} + '@babel/code-frame@7.26.2': resolution: {integrity: sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==} engines: {node: '>=6.9.0'} @@ -934,15 +946,18 @@ packages: resolution: {integrity: sha512-c7hNEllBlenFTHBky65mhq8WD2kbN9Q6gk0bTk8lSBvc554jpXSkST1iePudpt7+A/AQvuHs9EMqjHDXMY1lrA==} engines: {node: '>=18.18'} - '@iconify-icons/ep@1.2.12': - resolution: {integrity: sha512-8EJULn048sQq3fvytpQ5j40omnVOdBKpo+sXdYM35NRrqCe1BihxBesMcCOLWaocqkWia6uTQ3cnRHff4ZA11w==} + '@iconify-json/ep@1.2.2': + resolution: {integrity: sha512-/IH1GjQKH5uK7lQAOjwPxdjkU98OWUWnHYCdg/EkeebBKEteotaOMeEz5pR1egqMcI7zPFdFBTcGyCHla1ddQw==} - '@iconify-icons/ri@1.2.10': - resolution: {integrity: sha512-wNaXsQYK55WDUWCbcjvnwnODV4Jtsp+VC0duPanibEVu876TUYf6kdgTGtH7/GErBCNdJuJJbncG7vbOaeQi7w==} + '@iconify-json/ri@1.2.5': + resolution: {integrity: sha512-kWGimOXMZrlYusjBKKXYOWcKhbOHusFsmrmRGmjS7rH0BpML5A9/fy8KHZqFOwZfC4M6amObQYbh8BqO5cMC3w==} '@iconify/types@2.0.0': resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==} + '@iconify/utils@2.3.0': + resolution: {integrity: sha512-GmQ78prtwYW6EtzXRU1rY+KwOKfz32PD7iJh6Iyqw68GiKuoZ2A6pRtzWONz5VQJbp50mEjXh/7NkumtrAgRKA==} + '@iconify/vue@4.2.0': resolution: {integrity: sha512-CMynoz9BDWugDO2B7LU/s8L99dHCiqDGCjCki6bhVx5etZhw9x0BTV7wWRdj82jtl1yQTc+QQRcHQmSvUY6R+g==} peerDependencies: @@ -3007,6 +3022,10 @@ packages: resolution: {integrity: sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==} engines: {node: '>=18'} + globals@15.15.0: + resolution: {integrity: sha512-7ACyT3wmyp3I61S4fG682L0VA2RGD9otkqGJIwNUMF1SWUombIIk+af1unuDYgMm082aHYwD+mzJvv9Iu8dsgg==} + engines: {node: '>=18'} + globby@11.1.0: resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==} engines: {node: '>=10'} @@ -3524,6 +3543,9 @@ packages: known-css-properties@0.35.0: resolution: {integrity: sha512-a/RAk2BfKk+WFGhhOCAYqSiFLc34k8Mt/6NWRI4joER0EYUzXIcFivjjnoD3+XU1DggLn/tZc3DOAgke7l8a4A==} + kolorist@1.8.0: + resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==} + launch-ide@1.0.2: resolution: {integrity: sha512-h7U48fgoAdgIs2LLYHdwyL9xPGvWkVVAKo7U9PlLnNHR6UNp150hinAJBVWzd43gJ+GSqcvdbajdkKicx+cStQ==} @@ -3939,6 +3961,9 @@ packages: package-json-from-dist@1.0.1: resolution: {integrity: sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==} + package-manager-detector@0.2.11: + resolution: {integrity: sha512-BEnLolu+yuz22S56CU1SUKq3XC3PkwD5wv4ikR4MfGvnRVcmzXR9DwSlW2fEamyTPyXHomBJRzgapeuBvRNzJQ==} + parent-module@1.0.1: resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==} engines: {node: '>=6'} @@ -4368,6 +4393,9 @@ packages: resolution: {integrity: sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w==} engines: {node: '>=0.6'} + quansync@0.2.8: + resolution: {integrity: sha512-4+saucphJMazjt7iOM27mbFCk+D9dd/zmgMDCzRZ8MEoBfYp7lAvoN38et/phRQF6wOPMy/OROBGgoWeSKyluA==} + querystringify@2.2.0: resolution: {integrity: sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==} @@ -4995,6 +5023,29 @@ packages: resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==} engines: {node: '>= 10.0.0'} + unplugin-icons@22.1.0: + resolution: {integrity: sha512-ect2ZNtk1Zgwb0NVHd0C1IDW/MV+Jk/xaq4t8o6rYdVS3+L660ZdD5kTSQZvsgdwCvquRw+/wYn75hsweRjoIA==} + peerDependencies: + '@svgr/core': '>=7.0.0' + '@svgx/core': ^1.0.1 + '@vue/compiler-sfc': ^3.0.2 || ^2.7.0 + svelte: ^3.0.0 || ^4.0.0 || ^5.0.0 + vue-template-compiler: ^2.6.12 + vue-template-es2015-compiler: ^1.9.0 + peerDependenciesMeta: + '@svgr/core': + optional: true + '@svgx/core': + optional: true + '@vue/compiler-sfc': + optional: true + svelte: + optional: true + vue-template-compiler: + optional: true + vue-template-es2015-compiler: + optional: true + unplugin-utils@0.2.4: resolution: {integrity: sha512-8U/MtpkPkkk3Atewj1+RcKIjb5WBimZ/WSLhhR3w6SsIj8XJuKTacSP8g+2JhfSGw0Cb125Y+2zA/IzJZDVbhA==} engines: {node: '>=18.12.0'} @@ -5430,6 +5481,13 @@ snapshots: '@jridgewell/gen-mapping': 0.3.8 '@jridgewell/trace-mapping': 0.3.25 + '@antfu/install-pkg@1.0.0': + dependencies: + package-manager-detector: 0.2.11 + tinyexec: 0.3.2 + + '@antfu/utils@8.1.1': {} + '@babel/code-frame@7.26.2': dependencies: '@babel/helper-validator-identifier': 7.25.9 @@ -5964,16 +6022,29 @@ snapshots: '@humanwhocodes/retry@0.4.1': {} - '@iconify-icons/ep@1.2.12': + '@iconify-json/ep@1.2.2': dependencies: '@iconify/types': 2.0.0 - '@iconify-icons/ri@1.2.10': + '@iconify-json/ri@1.2.5': dependencies: '@iconify/types': 2.0.0 '@iconify/types@2.0.0': {} + '@iconify/utils@2.3.0': + dependencies: + '@antfu/install-pkg': 1.0.0 + '@antfu/utils': 8.1.1 + '@iconify/types': 2.0.0 + debug: 4.4.0 + globals: 15.15.0 + kolorist: 1.8.0 + local-pkg: 1.0.0 + mlly: 1.7.4 + transitivePeerDependencies: + - supports-color + '@iconify/vue@4.2.0(vue@3.5.13(typescript@5.7.3))': dependencies: '@iconify/types': 2.0.0 @@ -8387,6 +8458,8 @@ snapshots: globals@14.0.0: {} + globals@15.15.0: {} + globby@11.1.0: dependencies: array-union: 2.1.0 @@ -9102,6 +9175,8 @@ snapshots: known-css-properties@0.35.0: {} + kolorist@1.8.0: {} + launch-ide@1.0.2: dependencies: chalk: 4.1.1 @@ -9152,7 +9227,6 @@ snapshots: dependencies: mlly: 1.7.4 pkg-types: 1.3.1 - optional: true localforage@1.10.0: dependencies: @@ -9512,6 +9586,10 @@ snapshots: package-json-from-dist@1.0.1: {} + package-manager-detector@0.2.11: + dependencies: + quansync: 0.2.8 + parent-module@1.0.1: dependencies: callsites: 3.1.0 @@ -9895,6 +9973,8 @@ snapshots: dependencies: side-channel: 1.1.0 + quansync@0.2.8: {} + querystringify@2.2.0: {} queue-microtask@1.2.3: {} @@ -10587,6 +10667,18 @@ snapshots: universalify@2.0.1: {} + unplugin-icons@22.1.0(@vue/compiler-sfc@3.5.13): + dependencies: + '@antfu/install-pkg': 1.0.0 + '@iconify/utils': 2.3.0 + debug: 4.4.0 + local-pkg: 1.0.0 + unplugin: 2.2.0 + optionalDependencies: + '@vue/compiler-sfc': 3.5.13 + transitivePeerDependencies: + - supports-color + unplugin-utils@0.2.4: dependencies: pathe: 2.0.3 @@ -10602,7 +10694,6 @@ snapshots: dependencies: acorn: 8.14.0 webpack-virtual-modules: 0.6.2 - optional: true untyped@1.5.2: dependencies: diff --git a/src/components/ReDialog/index.vue b/src/components/ReDialog/index.vue index 23a0106e3..09f3e084a 100644 --- a/src/components/ReDialog/index.vue +++ b/src/components/ReDialog/index.vue @@ -8,8 +8,8 @@ import { } from "./index"; import { ref, computed } from "vue"; import { isFunction } from "@pureadmin/utils"; -import Fullscreen from "@iconify-icons/ri/fullscreen-fill"; -import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill"; +import Fullscreen from "~icons/ri/fullscreen-fill"; +import ExitFullscreen from "~icons/ri/fullscreen-exit-fill"; defineOptions({ name: "ReDialog" diff --git a/src/components/ReIcon/index.ts b/src/components/ReIcon/index.ts index 9f77a1eb6..358c33acc 100644 --- a/src/components/ReIcon/index.ts +++ b/src/components/ReIcon/index.ts @@ -13,3 +13,11 @@ const IconSelect = iconSelect; const FontIcon = fontIcon; export { IconifyIconOffline, IconifyIconOnline, IconSelect, FontIcon }; + +export function getIconOffline(icon: string) { + if (icon && icon.includes("/")) { + return icon.replace("/", ":"); + } else { + return icon; + } +} diff --git a/src/components/ReIcon/src/Select.vue b/src/components/ReIcon/src/Select.vue index 9c1366f06..8a9e95e58 100644 --- a/src/components/ReIcon/src/Select.vue +++ b/src/components/ReIcon/src/Select.vue @@ -2,7 +2,7 @@ import { IconJson } from "@/components/ReIcon/data"; import { cloneDeep, isAllEmpty } from "@pureadmin/utils"; import { ref, computed, CSSProperties, watch } from "vue"; -import Search from "@iconify-icons/ri/search-eye-line"; +import Search from "~icons/ri/search-eye-line"; type ParameterCSSProperties = (item?: string) => CSSProperties | undefined; diff --git a/src/components/ReIcon/src/hooks.ts b/src/components/ReIcon/src/hooks.ts index 300a25deb..adaac65af 100644 --- a/src/components/ReIcon/src/hooks.ts +++ b/src/components/ReIcon/src/hooks.ts @@ -1,6 +1,6 @@ import type { iconType } from "./types"; import { h, defineComponent, type Component } from "vue"; -import { IconifyIconOnline, IconifyIconOffline, FontIcon } from "../index"; +import { FontIcon, IconifyIconOnline, IconifyIconOffline } from "../index"; /** * 支持 `iconfont`、自定义 `svg` 以及 `iconify` 中所有的图标 @@ -52,7 +52,7 @@ export function useRenderIcon(icon: any, attrs?: iconType): Component { const IconifyIcon = icon && icon.includes(":") ? IconifyIconOnline : IconifyIconOffline; return h(IconifyIcon, { - icon: icon, + icon, ...attrs }); } diff --git a/src/components/ReIcon/src/iconifyIconOffline.ts b/src/components/ReIcon/src/iconifyIconOffline.ts index 4ba9dfc0a..d902a6611 100644 --- a/src/components/ReIcon/src/iconifyIconOffline.ts +++ b/src/components/ReIcon/src/iconifyIconOffline.ts @@ -1,4 +1,5 @@ import { h, defineComponent } from "vue"; +import { getIconOffline } from "../index"; import { Icon as IconifyIcon, addIcon } from "@iconify/vue/dist/offline"; // Iconify Icon在Vue里本地使用（用于内网环境） @@ -13,19 +14,35 @@ export default defineComponent({ render() { if (typeof this.icon === "object") addIcon(this.icon, this.icon); const attrs = this.$attrs; - return h( - IconifyIcon, - { - icon: this.icon, - "aria-hidden": false, - style: attrs?.style - ? Object.assign(attrs.style, { outline: "none" }) - : { outline: "none" }, - ...attrs - }, - { - default: () => [] - } - ); + if (typeof this.icon === "string") { + return h( + IconifyIcon, + { + icon: getIconOffline(this.icon), + "aria-hidden": false, + style: attrs?.style + ? Object.assign(attrs.style, { outline: "none" }) + : { outline: "none" }, + ...attrs + }, + { + default: () => [] + } + ); + } else { + return h( + this.icon, + { + "aria-hidden": false, + style: attrs?.style + ? Object.assign(attrs.style, { outline: "none" }) + : { outline: "none" }, + ...attrs + }, + { + default: () => [] + } + ); + } } }); diff --git a/src/components/ReIcon/src/offlineIcon.ts b/src/components/ReIcon/src/offlineIcon.ts index 2283a55d3..d7197032c 100644 --- a/src/components/ReIcon/src/offlineIcon.ts +++ b/src/components/ReIcon/src/offlineIcon.ts @@ -1,70 +1,105 @@ // 这里存放本地图标，在 src/layout/index.vue 文件中加载，避免在首启动加载 -import { addIcon } from "@iconify/vue/dist/offline"; +import { getIcons } from "@iconify/utils"; +import { addCollection } from "@iconify/vue/dist/offline"; // 本地菜单图标，后端在路由的 icon 中返回对应的图标字符串并且前端在此处使用 addIcon 添加即可渲染菜单图标 -// @iconify-icons/ep -import Menu from "@iconify-icons/ep/menu"; -import Edit from "@iconify-icons/ep/edit"; -import SetUp from "@iconify-icons/ep/set-up"; -import Guide from "@iconify-icons/ep/guide"; -import Monitor from "@iconify-icons/ep/monitor"; -import Lollipop from "@iconify-icons/ep/lollipop"; -import Histogram from "@iconify-icons/ep/histogram"; -import HomeFilled from "@iconify-icons/ep/home-filled"; -addIcon("ep:menu", Menu); -addIcon("ep:edit", Edit); -addIcon("ep:set-up", SetUp); -addIcon("ep:guide", Guide); -addIcon("ep:monitor", Monitor); -addIcon("ep:lollipop", Lollipop); -addIcon("ep:histogram", Histogram); -addIcon("ep:home-filled", HomeFilled); -// @iconify-icons/ri -import Tag from "@iconify-icons/ri/bookmark-2-line"; -import Ppt from "@iconify-icons/ri/file-ppt-2-line"; -import Card from "@iconify-icons/ri/bank-card-line"; -import Role from "@iconify-icons/ri/admin-fill"; -import Info from "@iconify-icons/ri/file-info-line"; -import Dept from "@iconify-icons/ri/git-branch-line"; -import Table from "@iconify-icons/ri/table-line"; -import Links from "@iconify-icons/ri/links-fill"; -import Search from "@iconify-icons/ri/search-line"; -import FlUser from "@iconify-icons/ri/admin-line"; -import Setting from "@iconify-icons/ri/settings-3-line"; -import MindMap from "@iconify-icons/ri/mind-map"; -import BarChart from "@iconify-icons/ri/bar-chart-horizontal-line"; -import LoginLog from "@iconify-icons/ri/window-line"; -import Artboard from "@iconify-icons/ri/artboard-line"; -import SystemLog from "@iconify-icons/ri/file-search-line"; -import ListCheck from "@iconify-icons/ri/list-check"; -import UbuntuFill from "@iconify-icons/ri/ubuntu-fill"; -import OnlineUser from "@iconify-icons/ri/user-voice-line"; -import EditBoxLine from "@iconify-icons/ri/edit-box-line"; -import OperationLog from "@iconify-icons/ri/history-fill"; -import InformationLine from "@iconify-icons/ri/information-line"; -import TerminalWindowLine from "@iconify-icons/ri/terminal-window-line"; -import CheckboxCircleLine from "@iconify-icons/ri/checkbox-circle-line"; -addIcon("ri:bookmark-2-line", Tag); -addIcon("ri:file-ppt-2-line", Ppt); -addIcon("ri:bank-card-line", Card); -addIcon("ri:admin-fill", Role); -addIcon("ri:file-info-line", Info); -addIcon("ri:git-branch-line", Dept); -addIcon("ri:links-fill", Links); -addIcon("ri:table-line", Table); -addIcon("ri:search-line", Search); -addIcon("ri:admin-line", FlUser); -addIcon("ri:settings-3-line", Setting); -addIcon("ri:mind-map", MindMap); -addIcon("ri:bar-chart-horizontal-line", BarChart); -addIcon("ri:window-line", LoginLog); -addIcon("ri:file-search-line", SystemLog); -addIcon("ri:artboard-line", Artboard); -addIcon("ri:list-check", ListCheck); -addIcon("ri:ubuntu-fill", UbuntuFill); -addIcon("ri:user-voice-line", OnlineUser); -addIcon("ri:edit-box-line", EditBoxLine); -addIcon("ri:history-fill", OperationLog); -addIcon("ri:information-line", InformationLine); -addIcon("ri:terminal-window-line", TerminalWindowLine); -addIcon("ri:checkbox-circle-line", CheckboxCircleLine); +// @iconify-json/ep +// import Menu from "~icons/ep/menu"; +// import Edit from "~icons/ep/edit"; +// import SetUp from "~icons/ep/set-up"; +// import Guide from "~icons/ep/guide"; +// import Monitor from "~icons/ep/monitor"; +// import Lollipop from "~icons/ep/lollipop"; +// import Histogram from "~icons/ep/histogram"; +// import HomeFilled from "~icons/ep/home-filled"; + +import { icons as iconsEp } from "@iconify-json/ep"; +addCollection( + getIcons(iconsEp, [ + "menu", + "edit", + "set-up", + "guide", + "monitor", + "lollipop", + "histogram", + "home-filled" + ]) +); + +// @iconify-json/ri +// import Tag from "~icons/ri/bookmark-2-line"; +// import Ppt from "~icons/ri/file-ppt-2-line"; +// import Card from "~icons/ri/bank-card-line"; +// import Role from "~icons/ri/admin-fill"; +// import Info from "~icons/ri/file-info-line"; +// import Dept from "~icons/ri/git-branch-line"; +// import Table from "~icons/ri/table-line"; +// import Links from "~icons/ri/links-fill"; +// import Search from "~icons/ri/search-line"; +// import FlUser from "~icons/ri/admin-line"; +// import Setting from "~icons/ri/settings-3-line"; +// import MindMap from "~icons/ri/mind-map"; +// import BarChart from "~icons/ri/bar-chart-horizontal-line"; +// import LoginLog from "~icons/ri/window-line"; +// import Artboard from "~icons/ri/artboard-line"; +// import SystemLog from "~icons/ri/file-search-line"; +// import ListCheck from "~icons/ri/list-check"; +// import UbuntuFill from "~icons/ri/ubuntu-fill"; +// import OnlineUser from "~icons/ri/user-voice-line"; +// import EditBoxLine from "~icons/ri/edit-box-line"; +// import OperationLog from "~icons/ri/history-fill"; +// import InformationLine from "~icons/ri/information-line"; +// import TerminalWindowLine from "~icons/ri/terminal-window-line"; +// import CheckboxCircleLine from "~icons/ri/checkbox-circle-line"; +// import ChatSearchLine from "~icons/ri/chat-search-line"; +import { icons as iconsRi } from "@iconify-json/ri"; +addCollection( + getIcons(iconsRi, [ + "bookmark-2-line", + "file-ppt-2-line", + "bank-card-line", + "admin-fill", + "file-info-line", + "git-branch-line", + "table-line", + "links-fill", + "search-line", + "admin-line", + "settings-3-line", + "mind-map", + "bar-chart-horizontal-line", + "window-line", + "artboard-line", + "file-search-line", + "list-check", + "ubuntu-fill", + "user-voice-line", + "edit-box-line", + "history-fill", + "information-line", + "terminal-window-line", + "checkbox-circle-line", + "chat-search-line", + "code-box-line", + "markdown-line" + ]) +); + +// { +// "prefix": "ri", +// "icons": { +// "bookmark-2-line": { +// "body": "" +// }, +// "information-line": { +// "body": "" +// }, +// "search-line": { +// "body": "" +// } +// }, +// "lastModified": 1734422306, +// "width": 24, +// "height": 24 +// } diff --git a/src/components/RePureTableBar/src/bar.tsx b/src/components/RePureTableBar/src/bar.tsx index de98fed89..815f5c071 100644 --- a/src/components/RePureTableBar/src/bar.tsx +++ b/src/components/RePureTableBar/src/bar.tsx @@ -18,8 +18,8 @@ import { getKeyList } from "@pureadmin/utils"; -import Fullscreen from "@iconify-icons/ri/fullscreen-fill"; -import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill"; +import Fullscreen from "~icons/ri/fullscreen-fill"; +import ExitFullscreen from "~icons/ri/fullscreen-exit-fill"; import DragIcon from "@/assets/table-bar/drag.svg?component"; import ExpandIcon from "@/assets/table-bar/expand.svg?component"; import RefreshIcon from "@/assets/table-bar/refresh.svg?component"; diff --git a/src/components/ReQrcode/src/index.tsx b/src/components/ReQrcode/src/index.tsx index 981271525..20f57ce44 100644 --- a/src/components/ReQrcode/src/index.tsx +++ b/src/components/ReQrcode/src/index.tsx @@ -11,7 +11,7 @@ import "./index.scss"; import propTypes from "@/utils/propTypes"; import { isString, cloneDeep } from "@pureadmin/utils"; import QRCode, { type QRCodeRenderersOptions } from "qrcode"; -import RefreshRight from "@iconify-icons/ep/refresh-right"; +import RefreshRight from "~icons/ep/refresh-right"; interface QrcodeLogo { src?: string; diff --git a/src/components/ReVxeTableBar/src/bar.tsx b/src/components/ReVxeTableBar/src/bar.tsx index 2e5216cac..769a103bf 100644 --- a/src/components/ReVxeTableBar/src/bar.tsx +++ b/src/components/ReVxeTableBar/src/bar.tsx @@ -12,8 +12,8 @@ import { getCurrentInstance } from "vue"; -import Fullscreen from "@iconify-icons/ri/fullscreen-fill"; -import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill"; +import Fullscreen from "~icons/ri/fullscreen-fill"; +import ExitFullscreen from "~icons/ri/fullscreen-exit-fill"; import DragIcon from "@/assets/table-bar/drag.svg?component"; import ExpandIcon from "@/assets/table-bar/expand.svg?component"; import RefreshIcon from "@/assets/table-bar/refresh.svg?component"; diff --git a/src/layout/components/lay-navbar/index.vue b/src/layout/components/lay-navbar/index.vue index 691d880ef..b346be487 100644 --- a/src/layout/components/lay-navbar/index.vue +++ b/src/layout/components/lay-navbar/index.vue @@ -9,10 +9,10 @@ import LaySidebarBreadCrumb from "../lay-sidebar/components/SidebarBreadCrumb.vu import LaySidebarTopCollapse from "../lay-sidebar/components/SidebarTopCollapse.vue"; import GlobalizationIcon from "@/assets/svg/globalization.svg?component"; -import AccountSettingsIcon from "@iconify-icons/ri/user-settings-line"; -import LogoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line"; -import Setting from "@iconify-icons/ri/settings-3-line"; -import Check from "@iconify-icons/ep/check"; +import AccountSettingsIcon from "~icons/ri/user-settings-line"; +import LogoutCircleRLine from "~icons/ri/logout-circle-r-line"; +import Setting from "~icons/ri/settings-3-line"; +import Check from "~icons/ep/check"; const { layout, diff --git a/src/layout/components/lay-notice/index.vue b/src/layout/components/lay-notice/index.vue index d85cf0f73..6ea5fb7db 100644 --- a/src/layout/components/lay-notice/index.vue +++ b/src/layout/components/lay-notice/index.vue @@ -3,7 +3,7 @@ import { useI18n } from "vue-i18n"; import { ref, computed } from "vue"; import { noticesData } from "./data"; import NoticeList from "./components/NoticeList.vue"; -import BellIcon from "@iconify-icons/ep/bell"; +import BellIcon from "~icons/ep/bell"; const { t } = useI18n(); const noticesNum = ref(0); diff --git a/src/layout/components/lay-panel/index.vue b/src/layout/components/lay-panel/index.vue index c0c5cc4f0..ba25bc206 100644 --- a/src/layout/components/lay-panel/index.vue +++ b/src/layout/components/lay-panel/index.vue @@ -4,7 +4,7 @@ import { emitter } from "@/utils/mitt"; import { onClickOutside } from "@vueuse/core"; import { ref, computed, onMounted, onBeforeUnmount } from "vue"; import { useDataThemeChange } from "@/layout/hooks/useDataThemeChange"; -import CloseIcon from "@iconify-icons/ep/close"; +import CloseIcon from "~icons/ep/close"; const target = ref(null); const show = ref(false); diff --git a/src/layout/components/lay-search/components/SearchFooter.vue b/src/layout/components/lay-search/components/SearchFooter.vue index d8350d0fe..17be4c8be 100644 --- a/src/layout/components/lay-search/components/SearchFooter.vue +++ b/src/layout/components/lay-search/components/SearchFooter.vue @@ -3,8 +3,8 @@ import { useI18n } from "vue-i18n"; import { useNav } from "@/layout/hooks/useNav"; import MdiKeyboardEsc from "@/assets/svg/keyboard_esc.svg?component"; import EnterOutlined from "@/assets/svg/enter_outlined.svg?component"; -import ArrowUpLine from "@iconify-icons/ri/arrow-up-line"; -import ArrowDownLine from "@iconify-icons/ri/arrow-down-line"; +import ArrowUpLine from "~icons/ri/arrow-up-line"; +import ArrowDownLine from "~icons/ri/arrow-down-line"; withDefaults(defineProps<{ total: number }>(), { total: 0 diff --git a/src/layout/components/lay-search/components/SearchHistoryItem.vue b/src/layout/components/lay-search/components/SearchHistoryItem.vue index 0ee9f1940..9ea67ae30 100644 --- a/src/layout/components/lay-search/components/SearchHistoryItem.vue +++ b/src/layout/components/lay-search/components/SearchHistoryItem.vue @@ -2,8 +2,8 @@ import type { optionsItem } from "../types"; import { transformI18n } from "@/plugins/i18n"; import { useRenderIcon } from "@/components/ReIcon/src/hooks"; -import StarIcon from "@iconify-icons/ep/star"; -import CloseIcon from "@iconify-icons/ep/close"; +import StarIcon from "~icons/ep/star"; +import CloseIcon from "~icons/ep/close"; interface Props { item: optionsItem; diff --git a/src/layout/components/lay-search/components/SearchModal.vue b/src/layout/components/lay-search/components/SearchModal.vue index f6993f6f6..f40ee34d1 100644 --- a/src/layout/components/lay-search/components/SearchModal.vue +++ b/src/layout/components/lay-search/components/SearchModal.vue @@ -13,7 +13,7 @@ import { ref, computed, shallowRef, watch } from "vue"; import { useDebounceFn, onKeyStroke } from "@vueuse/core"; import { usePermissionStoreHook } from "@/store/modules/permission"; import { cloneDeep, isAllEmpty, storageLocal } from "@pureadmin/utils"; -import SearchIcon from "@iconify-icons/ri/search-line"; +import SearchIcon from "~icons/ri/search-line"; interface Props { /** 弹窗显隐 */ diff --git a/src/layout/components/lay-setting/index.vue b/src/layout/components/lay-setting/index.vue index db931ba4d..72ae4304e 100644 --- a/src/layout/components/lay-setting/index.vue +++ b/src/layout/components/lay-setting/index.vue @@ -19,9 +19,9 @@ import Segmented, { type OptionsType } from "@/components/ReSegmented"; import { useDataThemeChange } from "@/layout/hooks/useDataThemeChange"; import { useDark, useGlobal, debounce, isNumber } from "@pureadmin/utils"; -import Check from "@iconify-icons/ep/check"; -import LeftArrow from "@iconify-icons/ri/arrow-left-s-line"; -import RightArrow from "@iconify-icons/ri/arrow-right-s-line"; +import Check from "~icons/ep/check"; +import LeftArrow from "~icons/ri/arrow-left-s-line"; +import RightArrow from "~icons/ri/arrow-right-s-line"; import DayIcon from "@/assets/svg/day.svg?component"; import DarkIcon from "@/assets/svg/dark.svg?component"; import SystemIcon from "@/assets/svg/system.svg?component"; diff --git a/src/layout/components/lay-sidebar/NavHorizontal.vue b/src/layout/components/lay-sidebar/NavHorizontal.vue index 6a2cd87ec..e94a8bdba 100644 --- a/src/layout/components/lay-sidebar/NavHorizontal.vue +++ b/src/layout/components/lay-sidebar/NavHorizontal.vue @@ -12,10 +12,10 @@ import LaySidebarItem from "../lay-sidebar/components/SidebarItem.vue"; import LaySidebarFullScreen from "../lay-sidebar/components/SidebarFullScreen.vue"; import GlobalizationIcon from "@/assets/svg/globalization.svg?component"; -import AccountSettingsIcon from "@iconify-icons/ri/user-settings-line"; -import LogoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line"; -import Setting from "@iconify-icons/ri/settings-3-line"; -import Check from "@iconify-icons/ep/check"; +import AccountSettingsIcon from "~icons/ri/user-settings-line"; +import LogoutCircleRLine from "~icons/ri/logout-circle-r-line"; +import Setting from "~icons/ri/settings-3-line"; +import Check from "~icons/ep/check"; const menuRef = ref(); const showLogo = ref( diff --git a/src/layout/components/lay-sidebar/NavMix.vue b/src/layout/components/lay-sidebar/NavMix.vue index c1562f2bc..ba0576d8c 100644 --- a/src/layout/components/lay-sidebar/NavMix.vue +++ b/src/layout/components/lay-sidebar/NavMix.vue @@ -13,10 +13,10 @@ import LaySidebarExtraIcon from "../lay-sidebar/components/SidebarExtraIcon.vue" import LaySidebarFullScreen from "../lay-sidebar/components/SidebarFullScreen.vue"; import GlobalizationIcon from "@/assets/svg/globalization.svg?component"; -import AccountSettingsIcon from "@iconify-icons/ri/user-settings-line"; -import LogoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line"; -import Setting from "@iconify-icons/ri/settings-3-line"; -import Check from "@iconify-icons/ep/check"; +import AccountSettingsIcon from "~icons/ri/user-settings-line"; +import LogoutCircleRLine from "~icons/ri/logout-circle-r-line"; +import Setting from "~icons/ri/settings-3-line"; +import Check from "~icons/ep/check"; const menuRef = ref(); const defaultActive = ref(null); diff --git a/src/layout/components/lay-sidebar/components/SidebarCenterCollapse.vue b/src/layout/components/lay-sidebar/components/SidebarCenterCollapse.vue index 0f41fcca4..8aba97f3d 100644 --- a/src/layout/components/lay-sidebar/components/SidebarCenterCollapse.vue +++ b/src/layout/components/lay-sidebar/components/SidebarCenterCollapse.vue @@ -4,7 +4,7 @@ import { useI18n } from "vue-i18n"; import { useGlobal } from "@pureadmin/utils"; import { useNav } from "@/layout/hooks/useNav"; -import ArrowLeft from "@iconify-icons/ri/arrow-left-double-fill"; +import ArrowLeft from "~icons/ri/arrow-left-double-fill"; interface Props { isActive: boolean; diff --git a/src/layout/components/lay-sidebar/components/SidebarItem.vue b/src/layout/components/lay-sidebar/components/SidebarItem.vue index edf4e8fe8..c87a70dbf 100644 --- a/src/layout/components/lay-sidebar/components/SidebarItem.vue +++ b/src/layout/components/lay-sidebar/components/SidebarItem.vue @@ -17,10 +17,10 @@ import { useAttrs } from "vue"; -import ArrowUp from "@iconify-icons/ep/arrow-up-bold"; -import EpArrowDown from "@iconify-icons/ep/arrow-down-bold"; -import ArrowLeft from "@iconify-icons/ep/arrow-left-bold"; -import ArrowRight from "@iconify-icons/ep/arrow-right-bold"; +import ArrowUp from "~icons/ep/arrow-up-bold"; +import EpArrowDown from "~icons/ep/arrow-down-bold"; +import ArrowLeft from "~icons/ep/arrow-left-bold"; +import ArrowRight from "~icons/ep/arrow-right-bold"; const attrs = useAttrs(); const { layout, isCollapse, tooltipEffect, getDivStyle } = useNav(); diff --git a/src/layout/components/lay-sidebar/components/SidebarLeftCollapse.vue b/src/layout/components/lay-sidebar/components/SidebarLeftCollapse.vue index c007d3b8a..32ea646f1 100644 --- a/src/layout/components/lay-sidebar/components/SidebarLeftCollapse.vue +++ b/src/layout/components/lay-sidebar/components/SidebarLeftCollapse.vue @@ -4,7 +4,7 @@ import { useI18n } from "vue-i18n"; import { useGlobal } from "@pureadmin/utils"; import { useNav } from "@/layout/hooks/useNav"; -import MenuFold from "@iconify-icons/ri/menu-fold-fill"; +import MenuFold from "~icons/ri/menu-fold-fill"; interface Props { isActive: boolean; diff --git a/src/layout/components/lay-sidebar/components/SidebarTopCollapse.vue b/src/layout/components/lay-sidebar/components/SidebarTopCollapse.vue index c2f1b5ad0..0461b1636 100644 --- a/src/layout/components/lay-sidebar/components/SidebarTopCollapse.vue +++ b/src/layout/components/lay-sidebar/components/SidebarTopCollapse.vue @@ -1,7 +1,7 @@ diff --git a/src/views/table/edit/demo1/index.vue b/src/views/table/edit/demo1/index.vue index 6beea0cd3..4b5096bfc 100644 --- a/src/views/table/edit/demo1/index.vue +++ b/src/views/table/edit/demo1/index.vue @@ -2,8 +2,8 @@ import { useColumns } from "./columns"; import Empty from "../empty.svg?component"; import { useRenderIcon } from "@/components/ReIcon/src/hooks"; -import AddFill from "@iconify-icons/ep/plus"; -import Delete from "@iconify-icons/ep/delete"; +import AddFill from "~icons/ep/plus"; +import Delete from "~icons/ep/delete"; const { columns, dataList, onAdd, onDel } = useColumns(); diff --git a/src/views/table/edit/demo3/columns.tsx b/src/views/table/edit/demo3/columns.tsx index 776941663..62cda66ae 100644 --- a/src/views/table/edit/demo3/columns.tsx +++ b/src/views/table/edit/demo3/columns.tsx @@ -1,8 +1,8 @@ import { ref, computed } from "vue"; import { tableDataEdit } from "../data"; -import EditPen from "@iconify-icons/ep/edit-pen"; -import Check from "@iconify-icons/ep/check"; +import EditPen from "~icons/ep/edit-pen"; +import Check from "~icons/ep/check"; export function useColumns() { const editMap = ref({}); diff --git a/src/views/welcome/components/table/columns.tsx b/src/views/welcome/components/table/columns.tsx index c6d0b8e0c..e56ad7e70 100644 --- a/src/views/welcome/components/table/columns.tsx +++ b/src/views/welcome/components/table/columns.tsx @@ -2,8 +2,8 @@ import { tableData } from "../../data"; import { delay } from "@pureadmin/utils"; import { ref, onMounted, reactive } from "vue"; import type { PaginationProps } from "@pureadmin/table"; -import ThumbUp from "@iconify-icons/ri/thumb-up-line"; -import Hearts from "@iconify-icons/ri/hearts-line"; +import ThumbUp from "~icons/ri/thumb-up-line"; +import Hearts from "~icons/ri/hearts-line"; import Empty from "./empty.svg?component"; export function useColumns() { diff --git a/src/views/welcome/data.ts b/src/views/welcome/data.ts index 3bb502116..86ce0f7cf 100644 --- a/src/views/welcome/data.ts +++ b/src/views/welcome/data.ts @@ -1,8 +1,8 @@ import { dayjs, cloneDeep, getRandomIntBetween } from "./utils"; -import GroupLine from "@iconify-icons/ri/group-line"; -import Question from "@iconify-icons/ri/question-answer-line"; -import CheckLine from "@iconify-icons/ri/chat-check-line"; -import Smile from "@iconify-icons/ri/star-smile-line"; +import GroupLine from "~icons/ri/group-line"; +import Question from "~icons/ri/question-answer-line"; +import CheckLine from "~icons/ri/chat-check-line"; +import Smile from "~icons/ri/star-smile-line"; const days = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"]; diff --git a/tsconfig.json b/tsconfig.json index fdbd4a668..4cbdd3992 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -35,6 +35,7 @@ "vite/client", "element-plus/global", "@pureadmin/table/volar", + "unplugin-icons/types/vue", "@pureadmin/descriptions/volar" ] }, diff --git a/types/router.d.ts b/types/router.d.ts index a03ba0e35..c0f3eaf07 100644 --- a/types/router.d.ts +++ b/types/router.d.ts @@ -15,9 +15,9 @@ declare global { /** 菜单名称（兼容国际化、非国际化，如何用国际化的写法就必须在根目录的`locales`文件夹下对应添加） `必填` */ title: string; /** 菜单图标 `可选` */ - icon?: string | FunctionalComponent | IconifyIcon; + icon?: string | FunctionalComponent; /** 菜单名称右侧的额外图标 */ - extraIcon?: string | FunctionalComponent | IconifyIcon; + extraIcon?: string | FunctionalComponent; /** 是否在菜单中显示（默认`true`）`可选` */ showLink?: boolean; /** 是否显示父级菜单 `可选` */ @@ -91,7 +91,7 @@ declare global { /** 菜单名称（兼容国际化、非国际化，如何用国际化的写法就必须在根目录的`locales`文件夹下对应添加）`必填` */ title: string; /** 菜单图标 `可选` */ - icon?: string | FunctionalComponent | IconifyIcon; + icon?: string | FunctionalComponent; /** 是否在菜单中显示（默认`true`）`可选` */ showLink?: boolean; /** 菜单升序排序，值越高排的越后（只针对顶级路由）`可选` */ @@ -104,5 +104,6 @@ declare global { // https://router.vuejs.org/zh/guide/advanced/meta.html#typescript declare module "vue-router" { + // eslint-disable-next-line @typescript-eslint/no-empty-object-type interface RouteMeta extends CustomizeRouteMeta {} }