fix: 修复循环依赖问题

vben
1 parent fa18365c
Showing 52 changed files with 86 additions and 99 deletions
internal/eslint-config/build.config.ts
internal/eslint-config/package.json
internal/eslint-config/src/index.ts
internal/eslint-config/src/strict.ts
package.json
pnpm-lock.yaml
src/components/Application/src/AppLocalePicker.vue
src/components/Application/src/search/AppSearchKeyItem.vue
src/components/Application/src/search/AppSearchModal.vue
src/components/Basic/src/BasicArrow.vue
src/components/Button/src/BasicButton.vue
src/components/ContextMenu/src/ContextMenu.vue
src/components/Cropper/src/CropperAvatar.vue
src/components/Dropdown/src/Dropdown.vue
src/components/FlowChart/src/FlowChartToolbar.vue
src/components/Icon/src/Icon.vue → src/components/Icon/Icon.vue
src/components/Icon/index.ts
src/components/Icon/src/IconPicker.vue
src/components/Menu/src/components/MenuItemContent.vue
src/components/SimpleMenu/src/SimpleSubMenu.vue
@@ -2,7 +2,7 @@ import { defineBuildConfig } from &#39;unbuild&#39;;
  
 export default defineBuildConfig({
   clean: true,
-  entries: ['src/index'],
+  entries: ['src/index', 'src/strict'],
   declaration: true,
   rollup: {
     emitCJS: true,
@@ -17,6 +17,11 @@
       "types": "./dist/index.d.ts",
       "import": "./dist/index.mjs",
       "require": "./dist/index.cjs"
+    },
+    "./strict": {
+      "types": "./dist/strict.d.ts",
+      "import": "./dist/strict.mjs",
+      "require": "./dist/strict.cjs"
     }
   },
   "main": "./dist/index.cjs",
@@ -38,7 +43,6 @@
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-simple-import-sort": "^10.0.0",
-    "eslint-plugin-unused-imports": "^2.0.0",
     "eslint-plugin-vue": "^9.10.0",
     "vue-eslint-parser": "^9.1.1"
   }
@@ -17,14 +17,7 @@ export default {
     createDefaultProgram: false,
     extraFileExtensions: ['.vue'],
   },
-  plugins: [
-    'vue',
-    '@typescript-eslint',
-    'import',
-    // TODO: 改造完成后开启
-    // 'unused-imports',
-    // 'simple-import-sort',
-  ],
+  plugins: ['vue', '@typescript-eslint', 'import'],
   extends: [
     'eslint:recommended',
     'plugin:vue/vue3-recommended',
@@ -37,19 +30,10 @@ export default {
     'no-use-before-define': 'off',
     'space-before-function-paren': 'off',
  
-    // TODO: 改造完成后开启
-    // 'simple-import-sort/imports': 'error',
-    // 'simple-import-sort/exports': 'error',
-
     'import/first': 'error',
     'import/newline-after-import': 'error',
     'import/no-duplicates': 'error',
  
-    // 'unused-imports/no-unused-imports': 'error',
-    // 'unused-imports/no-unused-vars': [
-    //   'warn',
-    //   { vars: 'all', varsIgnorePattern: '^_', args: 'after-used', argsIgnorePattern: '^_' },
-    // ],
     '@typescript-eslint/no-unused-vars': [
       'error',
       {
@@ -58,13 +42,13 @@ export default {
       },
     ],
     '@typescript-eslint/ban-ts-ignore': 'off',
+    '@typescript-eslint/ban-ts-comment': 'off',
+    '@typescript-eslint/ban-types': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-var-requires': 'off',
     '@typescript-eslint/no-empty-function': 'off',
     '@typescript-eslint/no-use-before-define': 'off',
-    '@typescript-eslint/ban-ts-comment': 'off',
-    '@typescript-eslint/ban-types': 'off',
     '@typescript-eslint/no-non-null-assertion': 'off',
     '@typescript-eslint/explicit-module-boundary-types': 'off',
     'vue/script-setup-uses-vars': 'error',
+import baseLintConfig from './index';
+
+export default {
+  extends: [baseLintConfig],
+  plugins: ['simple-import-sort'],
+  rules: {
+    'simple-import-sort/imports': 'error',
+    'simple-import-sort/exports': 'error',
+
+    '@typescript-eslint/ban-types': 'error',
+    '@typescript-eslint/ban-ts-ignore': 'error',
+    '@typescript-eslint/ban-ts-comment': 'error',
+    '@typescript-eslint/no-explicit-any': 'error',
+
+    'vue/attributes-order': 'error',
+    'vue/require-default-prop': 'error',
+  },
+};
@@ -71,6 +71,7 @@
     "@logicflow/core": "^1.2.1",
     "@logicflow/extension": "^1.2.1",
     "@vben/hooks": "workspace:*",
+    "@vue/shared": "^3.2.47",
     "@vueuse/core": "^9.13.0",
     "@vueuse/shared": "^9.13.0",
     "@zxcvbn-ts/core": "^2.2.1",
@@ -19,6 +19,9 @@ importers:
       '@vben/hooks':
         specifier: workspace:*
         version: link:packages/hooks
+      '@vue/shared':
+        specifier: ^3.2.47
+        version: 3.2.47
       '@vueuse/core':
         specifier: ^9.13.0
         version: 9.13.0(vue@3.2.47)
@@ -321,9 +324,6 @@ importers:
       eslint-plugin-simple-import-sort:
         specifier: ^10.0.0
         version: 10.0.0(eslint@8.37.0)
-      eslint-plugin-unused-imports:
-        specifier: ^2.0.0
-        version: 2.0.0(@typescript-eslint/eslint-plugin@5.57.1)(eslint@8.37.0)
       eslint-plugin-vue:
         specifier: ^9.10.0
         version: 9.10.0(eslint@8.37.0)
@@ -4483,21 +4483,6 @@ packages:
       eslint: 8.37.0
     dev: true
  
-  /eslint-plugin-unused-imports@2.0.0(@typescript-eslint/eslint-plugin@5.57.1)(eslint@8.37.0):
-    resolution: {integrity: sha512-3APeS/tQlTrFa167ThtP0Zm0vctjr4M44HMpeg1P4bK6wItarumq0Ma82xorMKdFsWpphQBlRPzw/pxiVELX1A==}
-    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
-    peerDependencies:
-      '@typescript-eslint/eslint-plugin': ^5.0.0
-      eslint: ^8.0.0
-    peerDependenciesMeta:
-      '@typescript-eslint/eslint-plugin':
-        optional: true
-    dependencies:
-      '@typescript-eslint/eslint-plugin': 5.57.1(@typescript-eslint/parser@5.57.1)(eslint@8.37.0)(typescript@5.0.3)
-      eslint: 8.37.0
-      eslint-rule-composer: 0.3.0
-    dev: true
-
   /eslint-plugin-vue@9.10.0(eslint@8.37.0):
     resolution: {integrity: sha512-2MgP31OBf8YilUvtakdVMc8xVbcMp7z7/iQj8LHVpXrSXHPXSJRUIGSPFI6b6pyCx/buKaFJ45ycqfHvQRiW2g==}
     engines: {node: ^14.17.0 || >=16.0.0}
@@ -4516,11 +4501,6 @@ packages:
       - supports-color
     dev: true
  
-  /eslint-rule-composer@0.3.0:
-    resolution: {integrity: sha512-bt+Sh8CtDmn2OajxvNO+BX7Wn4CIWMpTRm3MaiKPCQcnnlm0CS2mhui6QaoeQugs+3Kj2ESKEEGJUdVafwhiCg==}
-    engines: {node: '>=4.0.0'}
-    dev: true
-
   /eslint-scope@5.1.1:
     resolution: {integrity: sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==}
     engines: {node: '>=8.0.0'}
@@ -22,7 +22,7 @@
   import type { DropMenu } from '/@/components/Dropdown';
   import { ref, watchEffect, unref, computed } from 'vue';
   import { Dropdown } from '/@/components/Dropdown';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { useLocale } from '/@/locales/useLocale';
   import { localeList } from '/@/settings/localeSetting';
  
@@ -4,7 +4,7 @@
   </span>
 </template>
 <script lang="ts" setup>
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   defineProps({
     icon: String,
@@ -61,7 +61,7 @@
   import { computed, unref, ref, watch, nextTick } from 'vue';
   import { SearchOutlined } from '@ant-design/icons-vue';
   import AppSearchFooter from './AppSearchFooter.vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   // @ts-ignore
   import vClickOutside from '/@/directives/clickOutside';
   import { useDesign } from '/@/hooks/web/useDesign';
@@ -9,7 +9,7 @@
 </template>
 <script lang="ts" setup>
   import { computed } from 'vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { useDesign } from '/@/hooks/web/useDesign';
  
   const props = defineProps({
@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import { Button } from 'ant-design-vue';
   import { computed, unref } from 'vue';
-  import Icon from '/@/components/Icon/src/Icon.vue';
+  import Icon from '@/components/Icon/Icon.vue';
   import { buttonProps } from './props';
   import { useAttrs } from '@vben/hooks';
  
@@ -2,7 +2,7 @@
   import type { ContextMenuItem, ItemContentProps, Axis } from './typing';
   import type { FunctionalComponent, CSSProperties, PropType } from 'vue';
   import { defineComponent, nextTick, onMounted, computed, ref, unref, onUnmounted } from 'vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { Menu, Divider } from 'ant-design-vue';
  
   const prefixCls = 'context-menu';
@@ -45,7 +45,7 @@
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useI18n } from '/@/hooks/web/useI18n';
   import type { ButtonProps } from '/@/components/Button';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   const props = {
     width: { type: [String, Number], default: '200px' },
@@ -37,9 +37,10 @@
  
 <script lang="ts" setup>
   import { computed, PropType } from 'vue';
-  import type { DropMenu } from './typing';
+  import { type Recordable } from '@vben/types';
+  import { type DropMenu } from './typing';
   import { Dropdown, Menu, Popconfirm } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { omit } from 'lodash-es';
   import { isFunction } from '/@/utils/is';
  
@@ -63,7 +64,7 @@
       },
     },
     dropMenuList: {
-      type: Array as PropType<(DropMenu & Recordable)[]>,
+      type: Array as PropType<(DropMenu & Recordable<any>)[]>,
       default: () => [],
     },
     selectedKeys: {
@@ -19,7 +19,7 @@
  
   import { defineComponent, ref, onUnmounted, unref, nextTick, watchEffect } from 'vue';
   import { Divider, Tooltip } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   import { useFlowChartContext } from './useFlowContext';
   import { ToolbarTypeEnum } from './enum';
@@ -25,7 +25,7 @@
     computed,
     CSSProperties,
   } from 'vue';
-  import SvgIcon from './SvgIcon.vue';
+  import SvgIcon from './src/SvgIcon.vue';
   import Iconify from '@purge-icons/generated';
   import { isString } from '/@/utils/is';
   import { propTypes } from '/@/utils/propTypes';
@@ -57,7 +57,7 @@
       const update = async () => {
         if (unref(isSvgIcon)) return;
  
-        const el = unref(elRef);
+        const el: any = unref(elRef);
         if (!el) return;
  
         await nextTick();
-import Icon from './src/Icon.vue';
 import SvgIcon from './src/SvgIcon.vue';
 import IconPicker from './src/IconPicker.vue';
  
-export { Icon, IconPicker, SvgIcon };
+export { IconPicker, SvgIcon };
@@ -69,7 +69,7 @@
   import { useDesign } from '/@/hooks/web/useDesign';
   import { ScrollContainer } from '/@/components/Container';
   import { Input, Popover, Pagination, Empty } from 'ant-design-vue';
-  import Icon from './Icon.vue';
+  import Icon from '../Icon.vue';
   import SvgIcon from './SvgIcon.vue';
  
   import iconsData from '../data/icons.data';
@@ -167,7 +167,7 @@
     }
   }
  
-  function handleSearchChange(e: ChangeEvent) {
+  function handleSearchChange(e: Event) {
     const value = e.target.value;
     if (!value) {
       setCurrentPage(1);
@@ -6,8 +6,7 @@
 </template>
 <script lang="ts">
   import { computed, defineComponent } from 'vue';
-
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { contentProps } from '../props';
@@ -48,7 +48,7 @@
  
   import { defineComponent, computed } from 'vue';
   import { useDesign } from '/@/hooks/web/useDesign';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
  
   import MenuItem from './components/MenuItem.vue';
   import SubMenu from './components/SubMenuItem.vue';
@@ -75,7 +75,7 @@
   import { useMenuItem } from './useMenu';
   import { useSimpleRootMenuContext } from './useSimpleMenuContext';
   import { CollapseTransition } from '/@/components/Transition';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { Popover } from 'ant-design-vue';
   import { isBoolean, isObject } from '/@/utils/is';
   import { mitt } from '/@/utils/mitt';
@@ -34,7 +34,7 @@
   import { defineComponent, PropType, computed, toRaw, unref } from 'vue';
   import { MoreOutlined } from '@ant-design/icons-vue';
   import { Divider, Tooltip, TooltipProps } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
   import { ActionItem, TableActionType } from '/@/components/Table';
   import { PopConfirmButton } from '/@/components/Button';
   import { Dropdown } from '/@/components/Dropdown';
@@ -113,7 +113,7 @@
   import { Tooltip, Popover, Checkbox, Divider } from 'ant-design-vue';
   import type { CheckboxChangeEvent } from 'ant-design-vue/lib/checkbox/interface';
   import { SettingOutlined, DragOutlined } from '@ant-design/icons-vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { ScrollContainer } from '/@/components/Container';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useTableContext } from '../../hooks/useTableContext';
 import type { VNode, FunctionalComponent } from 'vue';
 import { h } from 'vue';
 import { isString } from 'lodash-es';
-import { Icon } from '/@/components/Icon';
+import Icon from '@/components/Icon/Icon.vue';
  
 export const TreeIcon: FunctionalComponent = ({ icon }: { icon: VNode | string }) => {
   if (!icon) return null;
@@ -33,9 +33,9 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { computed, ref, watch, useSlots } from 'vue';
+  import { type PropType, computed, ref, watch, useSlots } from 'vue';
   import { Dropdown, Menu, MenuItem, MenuDivider, InputSearch } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { BasicTitle } from '/@/components/Basic';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useDebounceFn } from '@vueuse/core';
@@ -37,7 +37,8 @@
 </template>
 <script lang="ts">
   import { defineComponent, ref, watch, unref, computed } from 'vue';
-  import { Icon } from '/@/components/Icon';
+  import { Recordable } from '@vben/types';
+  import Icon from '@/components/Icon/Icon.vue';
   import { Tooltip, Space } from 'ant-design-vue';
   import { useModal } from '/@/components/Modal';
   import { uploadContainerProps } from './props';
@@ -96,7 +97,7 @@
         emit('change', fileList.value);
       }
  
-      function handleDelete(record: Recordable) {
+      function handleDelete(record: Recordable<any>) {
         emit('delete', record);
       }
  
@@ -21,7 +21,7 @@
   import { defineComponent, ref, watchEffect } from 'vue';
  
   import { Breadcrumb } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useRootSetting } from '/@/hooks/setting/useRootSetting';
@@ -13,8 +13,7 @@
 <script lang="ts">
   import { defineComponent, computed } from 'vue';
   import { Tooltip, Badge } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
-
+  import Icon from '@/components/Icon/Icon.vue';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useErrorLogStore } from '/@/store/modules/errorLog';
   import { PageEnum } from '/@/enums/pageEnum';
@@ -10,8 +10,8 @@
   import { Menu } from 'ant-design-vue';
  
   import { computed, defineComponent, getCurrentInstance } from 'vue';
+  import Icon from '@/components/Icon/Icon.vue';
  
-  import { Icon } from '/@/components/Icon/index';
   import { propTypes } from '/@/utils/propTypes';
  
   export default defineComponent({
@@ -7,7 +7,7 @@
 <script lang="ts">
   import { defineComponent } from 'vue';
   import SettingDrawer from './SettingDrawer';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   import { useDrawer } from '/@/components/Drawer';
  
@@ -84,7 +84,7 @@
   import type { RouteLocationNormalized } from 'vue-router';
   import { ScrollContainer } from '/@/components/Container';
   import { SimpleMenu, SimpleMenuTag } from '/@/components/SimpleMenu';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { AppLogo } from '/@/components/Application';
   import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
   import { usePermissionStore } from '/@/store/modules/permission';
@@ -5,7 +5,7 @@
 </template>
 <script lang="ts">
   import { defineComponent, unref, computed } from 'vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting';
@@ -20,7 +20,7 @@
  
   import { defineComponent, computed, unref } from 'vue';
   import { Dropdown } from '/@/components/Dropdown/index';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   import { TabContentProps } from '../types';
  
@@ -27,7 +27,7 @@
 </template>
 <script lang="ts" setup>
   import { CountTo } from '/@/components/CountTo/index';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { Tag, Card } from 'ant-design-vue';
   import { growCardList } from '../data';
  
@@ -24,7 +24,7 @@
 <script lang="ts" setup>
   import { Card, List } from 'ant-design-vue';
   import { dynamicInfoItems } from './data';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   const ListItem = List.Item;
   const ListItemMeta = List.Item.Meta;
@@ -20,7 +20,7 @@
 <script lang="ts">
   import { defineComponent } from 'vue';
   import { Card, CardGrid } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { groupItems } from './data';
  
   export default defineComponent({
@@ -11,5 +11,5 @@
 <script lang="ts" setup>
   import { Card, CardGrid } from 'ant-design-vue';
   import { navItems } from './data';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
 </script>
@@ -64,7 +64,8 @@
     CodepenCircleFilled,
   } from '@ant-design/icons-vue';
  
-  import { Icon, IconPicker, SvgIcon } from '/@/components/Icon/index';
+  import { IconPicker, SvgIcon } from '/@/components/Icon/index';
+  import Icon from '/@/components/Icon/Icon.vue';
  
   import { openWindow } from '/@/utils';
   import { PageWrapper } from '/@/components/Page';
@@ -30,7 +30,7 @@
 <script lang="ts">
   import { defineComponent } from 'vue';
   import { List, Card, Row, Col } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
   import { applicationList } from './data';
  
   export default defineComponent({
@@ -42,7 +42,7 @@
 <script lang="ts">
   import { defineComponent } from 'vue';
   import { List, Tag } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
   import { actions, articleList } from './data';
  
   export default defineComponent({
@@ -56,7 +56,7 @@
   import { Tag, Tabs, Row, Col } from 'ant-design-vue';
   import { defineComponent, computed } from 'vue';
   import { CollapseContainer } from '/@/components/Container/index';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
   import Article from './Article.vue';
   import Application from './Application.vue';
   import Project from './Project.vue';
@@ -26,7 +26,7 @@
   import { List } from 'ant-design-vue';
   import { defineComponent } from 'vue';
   import { CollapseContainer } from '/@/components/Container/index';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
  
   import { accountBindList } from './data';
  
@@ -53,7 +53,7 @@
 <script lang="ts">
   import { Progress, Row, Col, List } from 'ant-design-vue';
   import { defineComponent } from 'vue';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
   import { cardList } from './data';
   import { PageWrapper } from '/@/components/Page';
  
@@ -34,7 +34,7 @@
 </template>
 <script lang="ts">
   import { defineComponent } from 'vue';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
   import { cardList } from './data';
   import { PageWrapper } from '/@/components/Page';
   import { Card, Row, Col, List } from 'ant-design-vue';
@@ -55,7 +55,7 @@
 <script lang="ts">
   import { Tag, List } from 'ant-design-vue';
   import { defineComponent } from 'vue';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
   import { BasicForm } from '/@/components/Form/index';
   import { actions, searchList, schemas } from './data';
   import { PageWrapper } from '/@/components/Page';
 import { BasicColumn, FormSchema } from '/@/components/Table';
 import { h } from 'vue';
 import { Tag } from 'ant-design-vue';
-import { Icon } from '/@/components/Icon';
+import Icon from '@/components/Icon/Icon.vue';
  
 export const columns: BasicColumn[] = [
   {
@@ -17,7 +17,7 @@
   import { IVFormComponent } from '../../../typings/v-form-component';
   import { remove } from '../../../utils';
   import { useFormDesignState } from '../../../hooks/useFormDesignState';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
  
   export default defineComponent({
     name: 'FormNodeOperate',
@@ -38,7 +38,7 @@
   import { remove } from '../../../utils';
   import message from '../../../utils/message';
   import { Input } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
  
   export default defineComponent({
     name: 'FormOptions',
@@ -38,7 +38,7 @@
   import { useFormDesignState } from '../../../hooks/useFormDesignState';
   import { isArray } from 'lodash-es';
   import { Form, FormItem, AutoComplete, Input } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
  
   export default defineComponent({
     name: 'RuleProps',
@@ -34,7 +34,7 @@
   import { defineComponent, reactive } from 'vue';
   import { IVFormComponent } from '../../../typings/v-form-component';
   import draggable from 'vuedraggable';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { useDesign } from '/@/hooks/web/useDesign';
  
   export default defineComponent({
@@ -31,7 +31,7 @@
   import { UseRefHistoryReturn } from '@vueuse/core';
   import { IFormConfig } from '../../../typings/v-form-component';
   import { Tooltip, Divider } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon/index';
+  import Icon from '@/components/Icon/Icon.vue';
  
   interface IToolbarsConfig {
     type: string;
@@ -48,7 +48,7 @@
   import { handleAsyncOptions } from '../../utils';
   import { omit } from 'lodash-es';
   import { Tooltip, FormItem, Divider, Col } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
+  import Icon from '@/components/Icon/Icon.vue';
   import { useFormModelState } from '../../hooks/useFormDesignState';
  
   export default defineComponent({