From b2d486928d522daaae4e24cdb723fb8219a6e4e1 Mon Sep 17 00:00:00 2001 From: xiaoxian521 <1923740402@qq.com> Date: Mon, 24 Mar 2025 13:25:55 +0800 Subject: [PATCH] =?UTF-8?q?chore:=20=E7=BB=A7=E7=BB=AD=E4=BD=BF=E7=94=A8`a?= =?UTF-8?q?ddIcon`=E6=B7=BB=E5=8A=A0=E7=A6=BB=E7=BA=BF=E5=9B=BE=E6=A0=87?= =?UTF-8?q?=EF=BC=8C=E5=9B=A0=E4=B8=BA`addCollection`=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E5=9B=BE=E6=A0=87=E5=90=8E=E6=97=A0=E6=B3=95`Tree-shaking`?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build/optimize.ts | 4 +- package.json | 6 +- pnpm-lock.yaml | 66 ++++----- src/components/ReIcon/index.ts | 8 -- .../ReIcon/src/iconifyIconOffline.ts | 3 +- src/components/ReIcon/src/offlineIcon.ts | 132 +++++++++++------- src/layout/components/lay-search/index.vue | 2 +- src/layout/types.ts | 2 +- 8 files changed, 118 insertions(+), 105 deletions(-) diff --git a/build/optimize.ts b/build/optimize.ts index a93266420..5ef414416 100644 --- a/build/optimize.ts +++ b/build/optimize.ts @@ -57,8 +57,8 @@ const include = [ /** * 在预构建中强制排除的依赖项 - * 温馨提示：所有以 `@iconify-json/` 开头引入的的本地图标模块，都应该加入到下面的 `exclude` 里，因为平台推荐的使用方式是哪里需要哪里引入而且都是单个的引入，不需要预构建，直接让浏览器加载就好 + * 温馨提示：平台推荐的使用方式是哪里需要哪里引入而且都是单个的引入，不需要预构建，直接让浏览器加载就好 */ -const exclude = ["@iconify-json/ep", "@iconify-json/ri"]; +const exclude = ["@iconify/json"]; export { include, exclude }; diff --git a/package.json b/package.json index 51383d83e..ceefcc284 100644 --- a/package.json +++ b/package.json @@ -54,7 +54,7 @@ "@logicflow/extension": "^1.2.28", "@pureadmin/descriptions": "^1.2.1", "@pureadmin/table": "^3.2.1", - "@pureadmin/utils": "^2.5.0", + "@pureadmin/utils": "^2.6.0", "@vue-flow/background": "^1.3.2", "@vue-flow/core": "^1.42.1", "@vueuse/core": "^12.5.0", @@ -119,9 +119,7 @@ "@commitlint/types": "^19.5.0", "@eslint/js": "^9.20.0", "@faker-js/faker": "^9.5.0", - "@iconify-json/ep": "^1.2.2", - "@iconify-json/ri": "^1.2.5", - "@iconify/utils": "^2.3.0", + "@iconify/json": "^2.2.319", "@iconify/vue": "4.2.0", "@intlify/unplugin-vue-i18n": "^6.0.3", "@types/codemirror": "^5.60.15", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c8401903f..80f085292 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -30,8 +30,8 @@ importers: specifier: ^3.2.1 version: 3.2.1(element-plus@2.9.4(vue@3.5.13(typescript@5.7.3)))(typescript@5.7.3) '@pureadmin/utils': - specifier: ^2.5.0 - version: 2.5.0(echarts@5.6.0)(vue@3.5.13(typescript@5.7.3)) + specifier: ^2.6.0 + version: 2.6.0(echarts@5.6.0)(vue@3.5.13(typescript@5.7.3)) '@vue-flow/background': specifier: ^1.3.2 version: 1.3.2(@vue-flow/core@1.42.1(vue@3.5.13(typescript@5.7.3)))(vue@3.5.13(typescript@5.7.3)) @@ -219,15 +219,9 @@ importers: '@faker-js/faker': specifier: ^9.5.0 version: 9.5.0 - '@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/json': + specifier: ^2.2.319 + version: 2.2.319 '@iconify/vue': specifier: 4.2.0 version: 4.2.0(vue@3.5.13(typescript@5.7.3)) @@ -946,11 +940,8 @@ packages: resolution: {integrity: sha512-c7hNEllBlenFTHBky65mhq8WD2kbN9Q6gk0bTk8lSBvc554jpXSkST1iePudpt7+A/AQvuHs9EMqjHDXMY1lrA==} engines: {node: '>=18.18'} - '@iconify-json/ep@1.2.2': - resolution: {integrity: sha512-/IH1GjQKH5uK7lQAOjwPxdjkU98OWUWnHYCdg/EkeebBKEteotaOMeEz5pR1egqMcI7zPFdFBTcGyCHla1ddQw==} - - '@iconify-json/ri@1.2.5': - resolution: {integrity: sha512-kWGimOXMZrlYusjBKKXYOWcKhbOHusFsmrmRGmjS7rH0BpML5A9/fy8KHZqFOwZfC4M6amObQYbh8BqO5cMC3w==} + '@iconify/json@2.2.319': + resolution: {integrity: sha512-ZGX8O3PXDxXdgltuW2JlXa7IuZ6uc34qKVIBRyPNo63fxjbw7rSOox7HKi3fJyhXqoL3aN0AtK1yOb5Cgcte8w==} '@iconify/types@2.0.0': resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==} @@ -985,16 +976,12 @@ packages: resolution: {integrity: sha512-bb8gZvoeKExCI2r/NVCK9E4YyOkvYGaSCPxVZe8T0jz8aX+dHEOZWxK06Z/Y9mWRkJfBiCH4aOhDF1yr1t5J8Q==} engines: {node: '>= 16'} - '@intlify/message-compiler@11.0.0-rc.1': - resolution: {integrity: sha512-TGw2uBfuTFTegZf/BHtUQBEKxl7Q/dVGLoqRIdw8lFsp9g/53sYn5iD+0HxIzdYjbWL6BTJMXCPUHp9PxDTRPw==} - engines: {node: '>= 16'} - '@intlify/message-compiler@11.1.1': resolution: {integrity: sha512-4iEsUZ3aF7jXY19CJFN5VP+pPyLITD9FVsjB13z9TU1UxaZLlFsmNhvRxlPDSOfHAP5RpNF2QKKdZ3DHVf4Yzw==} engines: {node: '>= 16'} - '@intlify/shared@11.0.0-rc.1': - resolution: {integrity: sha512-8tR1xe7ZEbkabTuE/tNhzpolygUn9OaYp9yuYAF4MgDNZg06C3Qny80bes2/e9/Wm3aVkPUlCw6WgU7mQd0yEg==} + '@intlify/message-compiler@12.0.0-alpha.2': + resolution: {integrity: sha512-PD9C+oQbb7BF52hec0+vLnScaFkvnfX+R7zSbODYuRo/E2niAtGmHd0wPvEMsDhf9Z9b8f/qyDsVeZnD/ya9Ug==} engines: {node: '>= 16'} '@intlify/shared@11.1.1': @@ -1005,6 +992,10 @@ packages: resolution: {integrity: sha512-dF2iMMy8P9uKVHV/20LA1ulFLL+MKSbfMiixSmn6fpwqzvix38OIc7ebgnFbBqElvghZCW9ACtzKTGKsTGTWGA==} engines: {node: '>= 16'} + '@intlify/shared@12.0.0-alpha.2': + resolution: {integrity: sha512-P2DULVX9nz3y8zKNqLw9Es1aAgQ1JGC+kgpx5q7yLmrnAKkPR5MybQWoEhxanefNJgUY5ehsgo+GKif59SrncA==} + engines: {node: '>= 16'} + '@intlify/unplugin-vue-i18n@6.0.3': resolution: {integrity: sha512-9ZDjBlhUHtgjRl23TVcgfJttgu8cNepwVhWvOv3mUMRDAhjW0pur1mWKEUKr1I8PNwE4Gvv2IQ1xcl4RL0nG0g==} engines: {node: '>= 18'} @@ -1326,8 +1317,8 @@ packages: peerDependencies: element-plus: ^2.0.0 - '@pureadmin/utils@2.5.0': - resolution: {integrity: sha512-DJyHBqxQo9Uo4GDEMbLD9xDNIn+VrOMBOyS6bgArY1a1iv4ffpDf0tA1tQ2HRFMiIcERC5abLWAASpgITM5LOQ==} + '@pureadmin/utils@2.6.0': + resolution: {integrity: sha512-xPncBQ4DZUstKrljsHxr3yuYacEZmvEilSfrZ6vpWNgJtPnViJ24Lf7gl7c1Y1RKYm/kXxjrhI7x69S2oN1Pvg==} peerDependencies: echarts: '*' vue: '*' @@ -6022,13 +6013,10 @@ snapshots: '@humanwhocodes/retry@0.4.1': {} - '@iconify-json/ep@1.2.2': - dependencies: - '@iconify/types': 2.0.0 - - '@iconify-json/ri@1.2.5': + '@iconify/json@2.2.319': dependencies: '@iconify/types': 2.0.0 + pathe: 1.1.2 '@iconify/types@2.0.0': {} @@ -6060,8 +6048,8 @@ snapshots: '@intlify/bundle-utils@10.0.0(vue-i18n@11.1.1(vue@3.5.13(typescript@5.7.3)))': dependencies: - '@intlify/message-compiler': 11.0.0-rc.1 - '@intlify/shared': 11.0.0-rc.1 + '@intlify/message-compiler': 12.0.0-alpha.2 + '@intlify/shared': 12.0.0-alpha.2 acorn: 8.14.0 escodegen: 2.1.0 estree-walker: 2.0.2 @@ -6077,22 +6065,22 @@ snapshots: '@intlify/message-compiler': 11.1.1 '@intlify/shared': 11.1.1 - '@intlify/message-compiler@11.0.0-rc.1': - dependencies: - '@intlify/shared': 11.0.0-rc.1 - source-map-js: 1.2.1 - '@intlify/message-compiler@11.1.1': dependencies: '@intlify/shared': 11.1.1 source-map-js: 1.2.1 - '@intlify/shared@11.0.0-rc.1': {} + '@intlify/message-compiler@12.0.0-alpha.2': + dependencies: + '@intlify/shared': 12.0.0-alpha.2 + source-map-js: 1.2.1 '@intlify/shared@11.1.1': {} '@intlify/shared@11.1.2': {} + '@intlify/shared@12.0.0-alpha.2': {} + '@intlify/unplugin-vue-i18n@6.0.3(@vue/compiler-dom@3.5.13)(eslint@9.20.1(jiti@2.4.2))(rollup@4.34.6)(typescript@5.7.3)(vue-i18n@11.1.1(vue@3.5.13(typescript@5.7.3)))(vue@3.5.13(typescript@5.7.3))': dependencies: '@eslint-community/eslint-utils': 4.4.1(eslint@9.20.1(jiti@2.4.2)) @@ -6493,7 +6481,7 @@ snapshots: '@pureadmin/descriptions@1.2.1(echarts@5.6.0)(element-plus@2.9.4(vue@3.5.13(typescript@5.7.3)))(typescript@5.7.3)': dependencies: '@element-plus/icons-vue': 2.3.1(vue@3.5.13(typescript@5.7.3)) - '@pureadmin/utils': 2.5.0(echarts@5.6.0)(vue@3.5.13(typescript@5.7.3)) + '@pureadmin/utils': 2.6.0(echarts@5.6.0)(vue@3.5.13(typescript@5.7.3)) element-plus: 2.9.4(vue@3.5.13(typescript@5.7.3)) vue: 3.5.13(typescript@5.7.3) transitivePeerDependencies: @@ -6507,7 +6495,7 @@ snapshots: transitivePeerDependencies: - typescript - '@pureadmin/utils@2.5.0(echarts@5.6.0)(vue@3.5.13(typescript@5.7.3))': + '@pureadmin/utils@2.6.0(echarts@5.6.0)(vue@3.5.13(typescript@5.7.3))': optionalDependencies: echarts: 5.6.0 vue: 3.5.13(typescript@5.7.3) diff --git a/src/components/ReIcon/index.ts b/src/components/ReIcon/index.ts index 358c33acc..9f77a1eb6 100644 --- a/src/components/ReIcon/index.ts +++ b/src/components/ReIcon/index.ts @@ -13,11 +13,3 @@ 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/iconifyIconOffline.ts b/src/components/ReIcon/src/iconifyIconOffline.ts index d902a6611..e5782b2ec 100644 --- a/src/components/ReIcon/src/iconifyIconOffline.ts +++ b/src/components/ReIcon/src/iconifyIconOffline.ts @@ -1,5 +1,4 @@ import { h, defineComponent } from "vue"; -import { getIconOffline } from "../index"; import { Icon as IconifyIcon, addIcon } from "@iconify/vue/dist/offline"; // Iconify Icon在Vue里本地使用（用于内网环境） @@ -18,7 +17,7 @@ export default defineComponent({ return h( IconifyIcon, { - icon: getIconOffline(this.icon), + icon: this.icon, "aria-hidden": false, style: attrs?.style ? Object.assign(attrs.style, { outline: "none" }) diff --git a/src/components/ReIcon/src/offlineIcon.ts b/src/components/ReIcon/src/offlineIcon.ts index 85d33e73b..82b6ec069 100644 --- a/src/components/ReIcon/src/offlineIcon.ts +++ b/src/components/ReIcon/src/offlineIcon.ts @@ -1,51 +1,87 @@ // 这里存放本地图标，在 src/layout/index.vue 文件中加载，避免在首启动加载 -import { getIcons } from "@iconify/utils"; -import { addCollection } from "@iconify/vue/dist/offline"; +import { getSvgInfo } from "@pureadmin/utils"; +import { addIcon } from "@iconify/vue/dist/offline"; -// 本地菜单图标，后端在路由的 icon 中返回对应的图标字符串并且前端在此处使用 addCollection 添加即可渲染菜单图标 -import { icons as iconsEp } from "@iconify-json/ep"; -addCollection( - getIcons(iconsEp, [ - "menu", - "edit", - "guide", - "set-up", - "monitor", - "lollipop", - "histogram", - "home-filled" - ]) -); +// https://icon-sets.iconify.design/ep/?keyword=ep +import EpMenu from "~icons/ep/menu?raw"; +import EpEdit from "~icons/ep/edit?raw"; +import EpGuide from "~icons/ep/guide?raw"; +import EpSetUp from "~icons/ep/set-up?raw"; +import EpMonitor from "~icons/ep/monitor?raw"; +import EpLollipop from "~icons/ep/lollipop?raw"; +import EpHistogram from "~icons/ep/histogram?raw"; +import EpHomeFilled from "~icons/ep/home-filled?raw"; -import { icons as iconsRi } from "@iconify-json/ri"; -addCollection( - getIcons(iconsRi, [ - "mind-map", - "admin-fill", - "table-line", - "links-fill", - "admin-line", - "list-check", - "ubuntu-fill", - "search-line", - "window-line", - "history-fill", - "edit-box-line", - "artboard-line", - "code-box-line", - "markdown-line", - "bank-card-line", - "file-info-line", - "bookmark-2-line", - "file-ppt-2-line", - "git-branch-line", - "settings-3-line", - "user-voice-line", - "file-search-line", - "information-line", - "chat-search-line", - "terminal-window-line", - "checkbox-circle-line", - "bar-chart-horizontal-line" - ]) -); +// https://icon-sets.iconify.design/ri/?keyword=ri +import RiMindMap from "~icons/ri/mind-map?raw"; +import RiAdminFill from "~icons/ri/admin-fill?raw"; +import RiTableLine from "~icons/ri/table-line?raw"; +import RiLinksFill from "~icons/ri/links-fill?raw"; +import RiAdminLine from "~icons/ri/admin-line?raw"; +import RiListCheck from "~icons/ri/list-check?raw"; +import RiSearchLine from "~icons/ri/search-line?raw"; +import RiWindowLine from "~icons/ri/window-line?raw"; +import RiUbuntuFill from "~icons/ri/ubuntu-fill?raw"; +import RiHistoryFill from "~icons/ri/history-fill?raw"; +import RiEditBoxLine from "~icons/ri/edit-box-line?raw"; +import RiCodeBoxLine from "~icons/ri/code-box-line?raw"; +import RiArtboardLine from "~icons/ri/artboard-line?raw"; +import RiMarkdownLine from "~icons/ri/markdown-line?raw"; +import RiFileInfoLine from "~icons/ri/file-info-line?raw"; +import RiBankCardLine from "~icons/ri/bank-card-line?raw"; +import RiFilePpt2Line from "~icons/ri/file-ppt-2-line?raw"; +import RiGitBranchLine from "~icons/ri/git-branch-line?raw"; +import RiSettings3Line from "~icons/ri/settings-3-line?raw"; +import RiUserVoiceLine from "~icons/ri/user-voice-line?raw"; +import RiBookmark2Line from "~icons/ri/bookmark-2-line?raw"; +import RiFileSearchLine from "~icons/ri/file-search-line?raw"; +import RiChatSearchLine from "~icons/ri/chat-search-line?raw"; +import RiInformationLine from "~icons/ri/information-line?raw"; +import RiTerminalWindowLine from "~icons/ri/terminal-window-line?raw"; +import RiCheckboxCircleLine from "~icons/ri/checkbox-circle-line?raw"; +import RiBarChartHorizontalLine from "~icons/ri/bar-chart-horizontal-line?raw"; + +const icons = [ + // Element Plus Icon: https://github.com/element-plus/element-plus-icons + ["ep/menu", EpMenu], + ["ep/edit", EpEdit], + ["ep/guide", EpGuide], + ["ep/set-up", EpSetUp], + ["ep/monitor", EpMonitor], + ["ep/lollipop", EpLollipop], + ["ep/histogram", EpHistogram], + ["ep/home-filled", EpHomeFilled], + // Remix Icon: https://github.com/Remix-Design/RemixIcon + ["ri/mind-map", RiMindMap], + ["ri/admin-fill", RiAdminFill], + ["ri/links-fill", RiTableLine], + ["ri/table-line", RiLinksFill], + ["ri/admin-line", RiAdminLine], + ["ri/list-check", RiListCheck], + ["ri/search-line", RiSearchLine], + ["ri/window-line", RiWindowLine], + ["ri/ubuntu-fill", RiUbuntuFill], + ["ri/history-fill", RiHistoryFill], + ["ri/edit-box-line", RiEditBoxLine], + ["ri/code-box-line", RiCodeBoxLine], + ["ri/artboard-line", RiArtboardLine], + ["ri/markdown-line", RiMarkdownLine], + ["ri/file-info-line", RiFileInfoLine], + ["ri/bank-card-line", RiBankCardLine], + ["ri/file-ppt-2-line", RiFilePpt2Line], + ["ri/git-branch-line", RiGitBranchLine], + ["ri/settings-3-line", RiSettings3Line], + ["ri/user-voice-line", RiUserVoiceLine], + ["ri/bookmark-2-line", RiBookmark2Line], + ["ri/file-search-line", RiFileSearchLine], + ["ri/chat-search-line", RiChatSearchLine], + ["ri/information-line", RiInformationLine], + ["ri/terminal-window-line", RiTerminalWindowLine], + ["ri/checkbox-circle-line", RiCheckboxCircleLine], + ["ri/bar-chart-horizontal-line", RiBarChartHorizontalLine] +]; + +// 本地菜单图标，后端在路由的 icon 中返回对应的图标字符串并且前端在此处使用 addIcon 添加即可渲染菜单图标 +icons.forEach(([name, icon]) => { + addIcon(name as string, getSvgInfo(icon as string)); +}); diff --git a/src/layout/components/lay-search/index.vue b/src/layout/components/lay-search/index.vue index 123d6a664..b9bf15cc4 100644 --- a/src/layout/components/lay-search/index.vue +++ b/src/layout/components/lay-search/index.vue @@ -14,7 +14,7 @@ function handleSearch() { class="search-container w-[40px] h-[48px] flex-c cursor-pointer navbar-bg-hover" @click="handleSearch" > - + diff --git a/src/layout/types.ts b/src/layout/types.ts index a30bfefeb..208a86c3f 100644 --- a/src/layout/types.ts +++ b/src/layout/types.ts @@ -8,7 +8,7 @@ export const routerArrays: Array = path: "/welcome", meta: { title: "menus.pureHome", - icon: "ep:home-filled" + icon: "ep/home-filled" } } ]