chore: 继续使用addIcon添加离线图标，因为addCollection添加图标后无法Tree-shaking

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 };

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",

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)

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;
-  }
-}

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" })

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));
+});

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"
     >
-      <IconifyIconOffline icon="ri:search-line" />
+      <IconifyIconOffline icon="ri/search-line" />
     </div>
     <SearchModal v-model:value="show" />
   </div>

src/layout/types.ts

@@ -8,7 +8,7 @@ export const routerArrays: Array<RouteConfigs> =
           path: "/welcome",
           meta: {
             title: "menus.pureHome",
-            icon: "ep:home-filled"
+            icon: "ep/home-filled"
           }
         }
       ]