perf: 使用eslint-plugin-import，自动排序import的引入，排序后的代码更简洁

.eslintrc

@@ -1,19 +1,12 @@
 {
-  "extends": [
-    "plugin:@typescript-eslint/recommended",
-    "plugin:vue/vue3-recommended",
-    "plugin:prettier/recommended"
-  ],
+  "extends": ["plugin:@typescript-eslint/recommended", "plugin:vue/vue3-recommended", "plugin:prettier/recommended"],
   "env": {
     "browser": true,
     "node": true,
     "jest": true,
     "es6": true
   },
-  "plugins": [
-    "vue",
-    "@typescript-eslint"
-  ],
+  "plugins": ["vue", "@typescript-eslint", "import"],
   "globals": {
     "cy": "readonly",
     "Cypress": "readonly",
@@ -31,12 +24,7 @@
     }
   },
   "settings": {
-    "import/extensions": [
-      ".js",
-      ".jsx",
-      ".ts",
-      ".tsx"
-    ]
+    "import/extensions": [".js", ".jsx", ".ts", ".tsx"]
   },
   "rules": {
     "no-console": [
@@ -49,8 +37,8 @@
     "no-continue": "off",
     "no-restricted-syntax": "off",
     "no-plusplus": "off",
-    "no-param-reassign":  "off",
-    "no-shadow":  "off",
+    "no-param-reassign": "off",
+    "no-shadow": "off",
     "no-underscore-dangle": ["error"],
     "no-unused-vars": "off",
     "no-unused-expressions": "off",
@@ -70,15 +58,35 @@
     "import/no-extraneous-dependencies": "off",
     "import/prefer-default-export": "off",
     "import/no-relative-packages": "off",
-
+    "import/no-duplicates": "error",
+    "import/order": [
+      "error",
+      {
+        "groups": ["builtin", "external", "internal", "parent", "sibling", "index", "object", "type", "unknown"],
+        "pathGroups": [
+          {
+            "pattern": "vue",
+            "group": "external",
+            "position": "before"
+          }
+        ],
+        "pathGroupsExcludedImportTypes": ["builtin"],
+        "newlines-between": "always",
+        "alphabetize": {
+          "order": "asc",
+          "caseInsensitive": true
+        }
+      }
+    ],
+
     // typescript config
     "@typescript-eslint/no-explicit-any": "off",
     "@typescript-eslint/explicit-module-boundary-types": "off",
     "@typescript-eslint/no-require-imports": 0,
     "@typescript-eslint/no-var-requires": 0,
     "@typescript-eslint/prefer-for-of": 0,
     "@typescript-eslint/ban-types": 0,
-    "@typescript-eslint/no-unused-vars":  [
+    "@typescript-eslint/no-unused-vars": [
       1,
       {
         "argsIgnorePattern": "^_",
@@ -100,15 +108,7 @@
       }
     },
     {
-      "files": [
-        "**/_example/*",
-        "**/_example-ts/*",
-        "script/**/*",
-        "script/*",
-        "*.js",
-        "site/**/*",
-        "site/*"
-      ],
+      "files": ["**/_example/*", "**/_example-ts/*", "script/**/*", "script/*", "*.js", "site/**/*", "site/*"],
       "rules": {
         "no-var-requires": 0,
         "no-console": 0,
@@ -117,18 +117,13 @@
       }
     },
     {
-      "files": [
-        "*.ts",
-        "*.tsx"
-      ],
+      "files": ["*.ts", "*.tsx"],
       "rules": {
         "@typescript-eslint/explicit-function-return-type": 0
       }
     },
     {
-      "files": [
-        "*.test.js"
-      ],
+      "files": ["*.test.js"],
       "rules": {
         "import/no-dynamic-require": "off",
         "global-require": "off"

src/affix/_example-ts/container.vue

@@ -19,6 +19,7 @@
 
 <script lang="tsx" setup>
 import { ref } from 'vue';
+
 import { AffixProps } from 'tdesign-vue-next';
 const affixed = ref(false);
 const affixContainerRef = ref(null);

src/affix/affix.tsx

@@ -1,12 +1,14 @@
 import { ref, watch, nextTick, onMounted, onBeforeUnmount, defineComponent, onActivated, onDeactivated } from 'vue';
+
 import isFunction from 'lodash/isFunction';
 import isUndefined from 'lodash/isUndefined';
 
-import { on, off, getScrollContainer } from '../utils/dom';
-import props from './props';
 import { ScrollContainerElement } from '../common';
-import { usePrefixClass } from '../hooks/useConfig';
 import { useTNodeJSX } from '../hooks/tnode';
+import { usePrefixClass } from '../hooks/useConfig';
+import { on, off, getScrollContainer } from '../utils/dom';
+
+import props from './props';
 
 export default defineComponent({
   name: 'TAffix',

src/affix/index.ts

@@ -1,5 +1,6 @@
-import _Affix from './affix';
 import withInstall from '../utils/withInstall';
+
+import _Affix from './affix';
 import { TdAffixProps } from './type';
 
 import './style';

src/alert/_example-ts/icon.vue

@@ -13,7 +13,7 @@
   </t-space>
 </template>
 <script lang="tsx" setup>
-import { AlertProps } from 'tdesign-vue-next';
 import { Icon } from 'tdesign-icons-vue-next';
+import { AlertProps } from 'tdesign-vue-next';
 const warningIcon: AlertProps['icon'] = () => <Icon name="error-circle-filled" />;
 </script>

src/alert/alert.tsx

@@ -1,22 +1,23 @@
 import { defineComponent, VNode, ref, onMounted, onBeforeUnmount } from 'vue';
+
+import isArray from 'lodash/isArray';
+import isString from 'lodash/isString';
 import {
   CheckCircleFilledIcon as TdCheckCircleFilledIcon,
   CloseIcon as TdCloseIcon,
   ErrorCircleFilledIcon as TdErrorCircleFilledIcon,
   HelpCircleFilledIcon as TdHelpCircleFilledIcon,
   InfoCircleFilledIcon as TdInfoCircleFilledIcon,
 } from 'tdesign-icons-vue-next';
-import isString from 'lodash/isString';
-import isArray from 'lodash/isArray';
 
-import { on, off, addClass } from '../utils/dom';
-import props from './props';
 import { SlotReturnValue } from '../common';
 import { useIcon } from '../hooks/icon';
-import { useGlobalIcon } from '../hooks/useGlobalIcon';
+import { useTNodeJSX } from '../hooks/tnode';
 import { useConfig, usePrefixClass } from '../hooks/useConfig';
+import { useGlobalIcon } from '../hooks/useGlobalIcon';
+import { on, off, addClass } from '../utils/dom';
 
-import { useTNodeJSX } from '../hooks/tnode';
+import props from './props';
 
 export default defineComponent({
   name: 'TAlert',

src/alert/index.ts

@@ -1,5 +1,6 @@
-import _Alert from './alert';
 import withInstall from '../utils/withInstall';
+
+import _Alert from './alert';
 import { TdAlertProps } from './type';
 
 import './style';

src/anchor/_example-ts/base.vue

@@ -12,6 +12,7 @@
 </template>
 <script lang="tsx" setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 const { appContext } = getCurrentInstance() || {};
 const path = computed(() => get(appContext, '$route.path', ''));

src/anchor/_example-ts/container.vue

@@ -17,8 +17,9 @@
 </template>
 <script lang="tsx" setup>
 import { computed, getCurrentInstance } from 'vue';
-import { AnchorProps } from 'tdesign-vue-next';
+
 import get from 'lodash/get';
+import { AnchorProps } from 'tdesign-vue-next';
 const { appContext } = getCurrentInstance();
 const path = computed(() => get(appContext, '$route.path', ''));
 const handleClick: AnchorProps['onClick'] = ({ e, href, title }) => {

src/anchor/_example-ts/cursor.vue

@@ -16,6 +16,7 @@
 </template>
 <script lang="tsx" setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 const { appContext } = getCurrentInstance();
 const path = computed(() => get(appContext, '$route.path', ''));

src/anchor/_example-ts/large.vue

@@ -13,6 +13,7 @@
 </template>
 <script lang="tsx" setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 const { appContext } = getCurrentInstance();
 const path = computed(() => get(appContext, '$route.path', ''));

src/anchor/_example-ts/multiple.vue

@@ -14,6 +14,7 @@
 </template>
 <script lang="tsx" setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 const { appContext } = getCurrentInstance();
 const path = computed(() => get(appContext, '$route.path', ''));

src/anchor/_example-ts/small.vue

@@ -13,6 +13,7 @@
 </template>
 <script lang="tsx" setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 const { appContext } = getCurrentInstance();
 const path = computed(() => get(appContext, '$route.path', ''));

src/anchor/_example-ts/target.vue

@@ -12,6 +12,7 @@
 
 <script lang="tsx" setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 const { appContext } = getCurrentInstance();
 const path = computed(() => get(appContext, '$route.path', ''));

src/anchor/_example/base.vue

@@ -12,6 +12,7 @@
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 
 const { appContext } = getCurrentInstance() || {};

src/anchor/_example/container.vue

@@ -17,6 +17,7 @@
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 
 const { appContext } = getCurrentInstance();

src/anchor/_example/cursor.vue

@@ -16,6 +16,7 @@
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 
 const { appContext } = getCurrentInstance();

src/anchor/_example/large.vue

@@ -13,6 +13,7 @@
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 
 const { appContext } = getCurrentInstance();

src/anchor/_example/multiple.vue

@@ -14,6 +14,7 @@
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 
 const { appContext } = getCurrentInstance();

src/anchor/_example/small.vue

@@ -13,6 +13,7 @@
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 
 const { appContext } = getCurrentInstance();

src/anchor/_example/target.vue

@@ -12,6 +12,7 @@
 
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
+
 import get from 'lodash/get';
 
 const { appContext } = getCurrentInstance();

src/anchor/anchor-item.tsx

@@ -1,11 +1,14 @@
 import { defineComponent, h, VNodeChild, onMounted, onUnmounted, inject, watch } from 'vue';
-import { ANCHOR_SHARP_REGEXP } from './utils';
-import props from './anchor-item-props';
-import { usePrefixClass, useCommonClassName } from '../hooks/useConfig';
-import { AnchorInjectionKey } from './constants';
+
 import isFunction from 'lodash/isFunction';
 import isString from 'lodash/isString';
 
+import { usePrefixClass, useCommonClassName } from '../hooks/useConfig';
+
+import props from './anchor-item-props';
+import { AnchorInjectionKey } from './constants';
+import { ANCHOR_SHARP_REGEXP } from './utils';
+
 const localProps = {
   ...props,
   href: {

src/anchor/anchor-target.tsx

@@ -1,11 +1,14 @@
 import { defineComponent } from 'vue';
+
 import { FileCopyIcon as TdFileCopyIcon } from 'tdesign-icons-vue-next';
-import { copyText } from '../utils/clipboard';
+
+import { useConfig, usePrefixClass } from '../hooks/useConfig';
+import { useGlobalIcon } from '../hooks/useGlobalIcon';
 import Message from '../message/plugin';
-import props from './anchor-target-props';
 import Popup from '../popup';
-import { useGlobalIcon } from '../hooks/useGlobalIcon';
-import { useConfig, usePrefixClass } from '../hooks/useConfig';
+import { copyText } from '../utils/clipboard';
+
+import props from './anchor-target-props';
 
 export default defineComponent({
   name: 'TAnchorTarget',

src/anchor/anchor.tsx

@@ -9,15 +9,17 @@ import {
   watchEffect,
   provide,
 } from 'vue';
-import { ANCHOR_SHARP_REGEXP, ANCHOR_CONTAINER, getOffsetTop } from './utils';
-import { isServer, on, off, getScroll, scrollTo, getScrollContainer as utilsGetScrollContainer } from '../utils/dom';
-import props from './props';
-import { useTNodeJSX } from '../hooks/tnode';
-import { SlotReturnValue } from '../common';
+
 import Affix from '../affix';
-import { TdAnchorProps } from './type';
+import { SlotReturnValue } from '../common';
+import { useTNodeJSX } from '../hooks/tnode';
 import { usePrefixClass, useCommonClassName } from '../hooks/useConfig';
+import { isServer, on, off, getScroll, scrollTo, getScrollContainer as utilsGetScrollContainer } from '../utils/dom';
+
 import { AnchorInjectionKey } from './constants';
+import props from './props';
+import { TdAnchorProps } from './type';
+import { ANCHOR_SHARP_REGEXP, ANCHOR_CONTAINER, getOffsetTop } from './utils';
 
 export interface Anchor extends ComponentPublicInstance {
   scrollContainer: ANCHOR_CONTAINER;

src/anchor/index.ts

@@ -1,7 +1,8 @@
+import withInstall from '../utils/withInstall';
+
 import _Anchor from './anchor';
 import _AnchorItem from './anchor-item';
 import _AnchorTarget from './anchor-target';
-import withInstall from '../utils/withInstall';
 import { TdAnchorProps, TdAnchorTargetProps, TdAnchorItemProps } from './type';
 
 import './style';