style: add import eslint

.eslintrc.js

@@ -11,8 +11,13 @@ module.exports = {
   parserOptions: {
     parser: 'babel-eslint',
   },
-  extends: ['plugin:vue/vue3-recommended', 'prettier'],
+  extends: [
-  plugins: ['markdown', 'jest', '@typescript-eslint'],
+    'plugin:vue/vue3-recommended',
+    'plugin:import/recommended',
+    'plugin:import/typescript',
+    'prettier',
+  ],
+  plugins: ['markdown', 'jest', '@typescript-eslint', 'import'],
   overrides: [
     {
       files: ['*.md'],
@@ -57,6 +62,9 @@ module.exports = {
     },
   ],
   rules: {
+    'import/no-named-as-default': 'off',
+    'import/namespace': [2, { allowComputed: true }],
+    'import/no-named-as-default-member': 'off',
     'comma-dangle': [2, 'always-multiline'],
     'no-var': 'error',
     'no-console': [2, { allow: ['warn', 'error'] }],

components/_util/hooks/useMergedState.ts

@@ -1,9 +1,5 @@
 import type { Ref, UnwrapRef } from 'vue';
-import { toRaw } from 'vue';
+import { toRaw, watchEffect, unref, watch, ref } from 'vue';
-import { watchEffect } from 'vue';
-import { unref } from 'vue';
-import { watch } from 'vue';
-import { ref } from 'vue';
 
 export default function useMergedState<T, R = Ref<T>>(
   defaultStateValue: T | (() => T),

components/_util/transition.tsx

@@ -5,9 +5,14 @@ import type {
   TransitionGroupProps,
   TransitionProps,
 } from 'vue';
-import { onUpdated } from 'vue';
+import {
-import { getCurrentInstance } from 'vue';
+  onUpdated,
-import { defineComponent, nextTick, Transition as T, TransitionGroup as TG } from 'vue';
+  getCurrentInstance,
+  defineComponent,
+  nextTick,
+  Transition as T,
+  TransitionGroup as TG,
+} from 'vue';
 
 export const getTransitionProps = (transitionName: string, opt: TransitionProps = {}) => {
   if (process.env.NODE_ENV === 'test') {

components/avatar/__tests__/Avatar.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Avatar from '..';
 import useBreakpoint from '../../_util/hooks/useBreakpoint';
 

components/badge/__tests__/index.test.js

@@ -2,7 +2,7 @@ import { mount } from '@vue/test-utils';
 import Badge from '../index';
 import mountTest from '../../../tests/shared/mountTest';
 
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 describe('Badge', () => {
   it('badge dot not scaling count > 9', () => {
     const badge = mount({

components/button/__tests__/wave.test.js

@@ -1,6 +1,6 @@
 import Button from '../index';
 import { mount } from '@vue/test-utils';
-import { asyncExpect, sleep } from '@/tests/utils';
+import { asyncExpect, sleep } from '../../../tests/utils';
 
 describe('click wave effect', () => {
   async function clickButton(wrapper) {

components/calendar/__tests__/index.test.js

@@ -1,11 +1,10 @@
 import dayjs from 'dayjs';
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect , sleep } from '../../../tests/utils';
 import MockDate from 'mockdate';
 import Calendar from '..';
 import Header from '../Header';
 import mountTest from '../../../tests/shared/mountTest';
-import { sleep } from '../../../tests/utils';
 import generateConfig from '../../vc-picker/generate/dayjs';
 
 describe('Calendar', () => {

components/carousel/__tests__/index.test.js

@@ -1,6 +1,6 @@
 import { mount } from '@vue/test-utils';
 import { h, createVNode } from 'vue';
-import { asyncExpect, sleep } from '@/tests/utils';
+import { asyncExpect, sleep } from '../../../tests/utils';
 import Carousel from '..';
 import mountTest from '../../../tests/shared/mountTest';
 

components/cascader/__tests__/index.test.js

@@ -1,4 +1,4 @@
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import { mount } from '@vue/test-utils';
 import KeyCode from '../../_util/KeyCode';
 import Cascader from '..';

components/checkbox/__tests__/group.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect, sleep } from '@/tests/utils';
+import { asyncExpect, sleep } from '../../../tests/utils';
 import Checkbox from '../index';
 import mountTest from '../../../tests/shared/mountTest';
 

components/color-picker/__tests__/index.test.js

@@ -1,6 +1,6 @@
 import { mount } from '@vue/test-utils';
 import ColorPicker from '..';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 describe('ColorPicker', () => {
   xit('should support default value', async () => {
     const wrapper = mount(

components/comment/__tests__/index.test.js

@@ -1,6 +1,6 @@
 import { mount } from '@vue/test-utils';
 import dayjs from 'dayjs';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Comment from '..';
 import List from '../../list';
 import Form from '../../form';

components/date-picker/__tests__/DatePicker.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import dayjs from 'dayjs';
 import MockDate from 'mockdate';
 import DatePicker from '..';

components/date-picker/__tests__/RangePicker.test.js

@@ -1,8 +1,7 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect, setMockDate, resetMockDate, sleep } from '../../../tests/utils';
 import dayjs from 'dayjs';
 import DatePicker from '../';
-import { setMockDate, resetMockDate, sleep } from '../../../tests/utils';
 import { openPicker, selectCell, closePicker } from './utils';
 import focusTest from '../../../tests/shared/focusTest';
 

components/date-picker/__tests__/WeekPicker.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import DatePicker from '..';
 import focusTest from '../../../tests/shared/focusTest';
 

components/date-picker/__tests__/other.test.js

@@ -1,10 +1,9 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect, sleep } from '../../../tests/utils';
 import dayjs from 'dayjs';
 import DatePicker from '../';
 import LocaleProvider from '../../locale-provider';
 import locale from '../../locale-provider/zh_CN';
-import { sleep } from '../../../tests/utils';
 
 const { MonthPicker, WeekPicker } = DatePicker;
 

components/date-picker/generatePicker/generateRangePicker.tsx

@@ -22,12 +22,12 @@ export default function generateRangePicker<DateType, ExtraProps = {}>(
 ) {
   const RangePicker = defineComponent({
     name: 'ARangePicker',
+    inheritAttrs: false,
     props: {
       ...commonProps<DateType>(),
       ...rangePickerProps<DateType>(),
       ...extraProps,
     },
-    inheritAttrs: false,
     slots: [
       'suffixIcon',
       // 'clearIcon',

components/descriptions/__tests__/index.test.js

@@ -3,7 +3,7 @@ import { h } from 'vue';
 import MockDate from 'mockdate';
 import Descriptions from '..';
 import { resetWarned } from '../../_util/warning';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 
 describe('Descriptions', () => {
   const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});

components/drawer/__tests__/Drawer.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Drawer from '..';
 
 const DrawerCom = {

components/drawer/__tests__/DrawerEvent.test.js

@@ -1,7 +1,7 @@
 import { mount } from '@vue/test-utils';
 import Drawer from '..';
 import Button from '../../button';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 
 const DrawerEventTester = {
   props: {

components/drawer/__tests__/MultiDrawer.test.js

@@ -1,7 +1,7 @@
 import { mount } from '@vue/test-utils';
 import Drawer from '..';
 import Button from '../../button';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 export function $$(className) {
   return document.body.querySelectorAll(className);
 }

components/dropdown/dropdown.tsx

@@ -1,6 +1,5 @@
 import type { ExtractPropTypes } from 'vue';
-import { computed } from 'vue';
+import { computed, defineComponent } from 'vue';
-import { defineComponent } from 'vue';
 import RcDropdown from '../vc-dropdown';
 import DropdownButton from './dropdown-button';
 import { cloneElement } from '../_util/vnode';

components/form/FormItem.tsx

@@ -1,6 +1,5 @@
 import type { PropType, ExtractPropTypes, ComputedRef } from 'vue';
-import { watch } from 'vue';
+import { watch, defineComponent, computed, nextTick, ref, watchEffect, onBeforeUnmount } from 'vue';
-import { defineComponent, computed, nextTick, ref, watchEffect, onBeforeUnmount } from 'vue';
 import cloneDeep from 'lodash-es/cloneDeep';
 import PropTypes from '../_util/vue-types';
 import Row from '../grid/Row';

components/form/useForm.ts

@@ -1,6 +1,5 @@
 import type { Ref } from 'vue';
-import { computed } from 'vue';
+import { computed, reactive, watch, nextTick, unref } from 'vue';
-import { reactive, watch, nextTick, unref } from 'vue';
 import cloneDeep from 'lodash-es/cloneDeep';
 import intersection from 'lodash-es/intersection';
 import isEqual from 'lodash-es/isEqual';

components/grid/context.ts

@@ -1,6 +1,5 @@
-import { computed } from 'vue';
+import { computed, inject, provide } from 'vue';
 import type { Ref, InjectionKey, ComputedRef } from 'vue';
-import { inject, provide } from 'vue';
 
 export interface RowContext {
   gutter: ComputedRef<[number, number]>;

components/input/ResizableTextArea.tsx

@@ -1,5 +1,5 @@
 import type { PropType, VNode } from 'vue';
-import { nextTick } from 'vue';
+import { nextTick, defineComponent, withDirectives } from 'vue';
 import ResizeObserver from '../vc-resize-observer';
 import omit from 'omit.js';
 import classNames from '../_util/classNames';
@@ -10,7 +10,6 @@ import BaseMixin from '../_util/BaseMixin';
 import inputProps from './inputProps';
 import PropTypes from '../_util/vue-types';
 import { getOptionProps } from '../_util/props-util';
-import { defineComponent, withDirectives } from 'vue';
 import antInput from '../_util/antInputDirective';
 
 const RESIZE_STATUS_NONE = 0;

components/input/__tests__/Search.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Input from '../index';
 import Button from '../../button';
 import focusTest from '../../../tests/shared/focusTest';

components/input/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Input from '..';
 // import Form from '../../form';
 import focusTest from '../../../tests/shared/focusTest';

components/list/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import List from '..';
 import mountTest from '../../../tests/shared/mountTest';
 

components/locale-provider/LocaleReceiver.tsx

@@ -1,6 +1,5 @@
 import type { VNodeTypes, PropType, ComputedRef, Ref } from 'vue';
-import { unref } from 'vue';
+import { unref, inject, defineComponent, computed } from 'vue';
-import { inject, defineComponent, computed } from 'vue';
 import PropTypes from '../_util/vue-types';
 import defaultLocaleData from './default';
 import type { Locale } from '.';

components/mentions/index.tsx

@@ -1,7 +1,5 @@
 import type { App, PropType, Plugin, ExtractPropTypes } from 'vue';
-import { watch } from 'vue';
+import { watch, ref, onMounted, defineComponent, nextTick } from 'vue';
-import { ref, onMounted } from 'vue';
-import { defineComponent, nextTick } from 'vue';
 import classNames from '../_util/classNames';
 import omit from 'omit.js';
 import PropTypes from '../_util/vue-types';

components/menu/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Menu from '..';
 import { InboxOutlined, PieChartOutlined } from '@ant-design/icons-vue';
 import mountTest from '../../../tests/shared/mountTest';

components/message/__tests__/index.test.js

@@ -1,4 +1,4 @@
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import message from '..';
 import SmileOutlined from '@ant-design/icons-vue/SmileOutlined';
 

components/modal/__tests__/Modal.test.js

@@ -1,7 +1,7 @@
 import { mount } from '@vue/test-utils';
 import Modal from '..';
 import mountTest from '../../../tests/shared/mountTest';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 
 const ModalTester = {
   props: ['footer', 'visible'],

components/notification/__tests__/index.test.js

@@ -1,4 +1,4 @@
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import notification from '..';
 import { StepBackwardOutlined } from '@ant-design/icons-vue';
 

components/notification/__tests__/placement.test.js

@@ -1,4 +1,4 @@
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import notification from '..';
 
 describe('Notification.placement', () => {

components/pagination/Pagination.tsx

@@ -1,6 +1,5 @@
 import type { ExtractPropTypes } from 'vue';
-import { computed, toRef } from 'vue';
+import { computed, toRef, defineComponent } from 'vue';
-import { defineComponent } from 'vue';
 import LeftOutlined from '@ant-design/icons-vue/LeftOutlined';
 import RightOutlined from '@ant-design/icons-vue/RightOutlined';
 import DoubleLeftOutlined from '@ant-design/icons-vue/DoubleLeftOutlined';

components/popconfirm/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Popconfirm from '..';
 function $$(className) {
   return document.body.querySelectorAll(className);

components/popconfirm/index.tsx

@@ -1,7 +1,6 @@
 import omit from 'omit.js';
 import type { ExtractPropTypes, PropType } from 'vue';
-import { computed, onMounted, ref, toRef } from 'vue';
+import { computed, onMounted, ref, toRef, defineComponent } from 'vue';
-import { defineComponent } from 'vue';
 import Tooltip from '../tooltip';
 import abstractTooltipProps from '../tooltip/abstractTooltipProps';
 import PropTypes from '../_util/vue-types';

components/popover/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Popover from '..';
 import mountTest from '../../../tests/shared/mountTest';
 

components/progress/Steps.tsx

@@ -1,6 +1,5 @@
 import type { ExtractPropTypes, PropType, VNodeChild } from 'vue';
-import { computed } from 'vue';
+import { computed, defineComponent } from 'vue';
-import { defineComponent } from 'vue';
 import PropTypes from '../_util/vue-types';
 import type { ProgressSize } from './props';
 import { progressProps } from './props';

components/progress/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import { handleGradient, sortGradient } from '../Line';
 import Progress from '..';
 import ProgressSteps from '../Steps';

components/radio/__tests__/group.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Radio from '../Radio';
 import RadioGroup from '../Group';
 

components/radio/__tests__/radio.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Radio, { Group, Button } from '..';
 import focusTest from '../../../tests/shared/focusTest';
 import mountTest from '../../../tests/shared/mountTest';

components/rate/index.tsx

@@ -1,6 +1,5 @@
 import type { ExtractPropTypes, VNode } from 'vue';
-import { watch } from 'vue';
+import { watch, defineComponent, ref, reactive, onMounted } from 'vue';
-import { defineComponent, ref, reactive, onMounted } from 'vue';
 import { initDefaultProps, getPropsSlot, findDOMNode } from '../_util/props-util';
 import { withInstall } from '../_util/type';
 import { getOffsetLeft } from './util';

components/select/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Select from '..';
 import CloseOutlined from '@ant-design/icons-vue/CloseOutlined';
 import focusTest from '../../../tests/shared/focusTest';

components/select/index.tsx

@@ -1,8 +1,7 @@
 import type { App, PropType, Plugin, ExtractPropTypes } from 'vue';
 import { computed, defineComponent, ref } from 'vue';
 import classNames from '../_util/classNames';
-import { selectProps as vcSelectProps } from '../vc-select';
+import RcSelect, { selectProps as vcSelectProps, Option, OptGroup } from '../vc-select';
-import RcSelect, { Option, OptGroup } from '../vc-select';
 import type { OptionProps as OptionPropsType } from '../vc-select/Option';
 import getIcons from './utils/iconUtil';
 import PropTypes from '../_util/vue-types';

components/skeleton/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Skeleton from '..';
 import mountTest from '../../../tests/shared/mountTest';
 

components/slider/SliderTooltip.tsx

@@ -1,6 +1,4 @@
-import { onBeforeUnmount, watch } from 'vue';
+import { onBeforeUnmount, watch, onActivated, defineComponent, ref } from 'vue';
-import { onActivated } from 'vue';
-import { defineComponent, ref } from 'vue';
 import Tooltip, { tooltipProps } from '../tooltip';
 import raf from '../_util/raf';
 

components/slider/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Slider from '..';
 import mountTest from '../../../tests/shared/mountTest';
 

components/slider/index.tsx

@@ -1,13 +1,11 @@
-import type { CSSProperties, VNodeTypes } from 'vue';
+import type { CSSProperties, VNodeTypes, PropType } from 'vue';
-import { computed, ref } from 'vue';
+import { computed, ref, defineComponent } from 'vue';
-import { defineComponent } from 'vue';
 import BaseMixin from '../_util/BaseMixin';
 import VcSlider from '../vc-slider/src/Slider';
 import VcRange from '../vc-slider/src/Range';
 import VcHandle from '../vc-slider/src/Handle';
 import type { VueNode } from '../_util/type';
 import { withInstall } from '../_util/type';
-import type { PropType } from 'vue';
 import type { TooltipPlacement } from '../tooltip/Tooltip';
 import useConfigInject from '../_util/hooks/useConfigInject';
 import SliderTooltip from './SliderTooltip';

components/spin/__tests__/delay.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Spin from '..';
 
 describe('delay spinning', () => {

components/spin/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Spin from '..';
 
 describe('Spin', () => {

components/steps/index.tsx

@@ -1,6 +1,5 @@
 import type { App, ExtractPropTypes, Plugin } from 'vue';
-import { computed } from 'vue';
+import { computed, defineComponent } from 'vue';
-import { defineComponent } from 'vue';
 import CloseOutlined from '@ant-design/icons-vue/CloseOutlined';
 import CheckOutlined from '@ant-design/icons-vue/CheckOutlined';
 import PropTypes, { withUndefined } from '../_util/vue-types';

components/switch/__tests__/index.test.js

@@ -4,7 +4,7 @@ import focusTest from '../../../tests/shared/focusTest';
 import { resetWarned } from '../../_util/warning';
 import mountTest from '../../../tests/shared/mountTest';
 import { ref } from 'vue';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 
 describe('Switch', () => {
   focusTest(Switch);

components/table/Table.tsx

@@ -35,8 +35,7 @@ import defaultLocale from '../locale/en_US';
 import type { SizeType } from '../config-provider';
 import devWarning from '../vc-util/devWarning';
 import type { PropType } from 'vue';
-import { reactive, ref } from 'vue';
+import { reactive, ref, computed, defineComponent, toRef, watchEffect } from 'vue';
-import { computed, defineComponent, toRef, watchEffect } from 'vue';
 import type { DefaultRecordType } from '../vc-table/interface';
 import useBreakpoint from '../_util/hooks/useBreakpoint';
 import useConfigInject from '../_util/hooks/useConfigInject';

components/table/__tests__/Table.filter.test.js

@@ -1,7 +1,6 @@
 import * as Vue from 'vue';
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect, sleep } from '../../../tests/utils';
-import { sleep } from '../../../tests/utils';
 import Table from '..';
 
 function $$(className) {

components/table/__tests__/Table.pagination.test.js

@@ -1,8 +1,7 @@
 import { mount } from '@vue/test-utils';
 import Table from '..';
 import * as Vue from 'vue';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect, sleep } from '../../../tests/utils';
-import { sleep } from '../../../tests/utils';
 
 describe('Table.pagination', () => {
   const columns = [

components/table/__tests__/Table.rowSelection.test.js

@@ -1,7 +1,6 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect, sleep } from '../../../tests/utils';
 import Table from '..';
-import { sleep } from '../../../tests/utils';
 
 describe('Table.rowSelection', () => {
   const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});

components/table/__tests__/Table.sorter.test.js

@@ -1,6 +1,6 @@
 import * as Vue from 'vue';
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Table from '..';
 
 describe('Table.sorter', () => {

components/table/context.ts

@@ -1,6 +1,5 @@
 import type { ComputedRef, InjectionKey } from 'vue';
-import { computed } from 'vue';
+import { computed, inject, provide } from 'vue';
-import { inject, provide } from 'vue';
 
 export type ContextSlots = {
   emptyText?: (...args: any[]) => any;

components/table/hooks/useLazyKVMap.ts

@@ -1,6 +1,5 @@
 import type { Ref } from 'vue';
-import { watch } from 'vue';
+import { watch, ref } from 'vue';
-import { ref } from 'vue';
 import type { Key, GetRowKey } from '../interface';
 
 interface MapCache<RecordType> {

components/tabs/__tests__/index.test.js

@@ -1,7 +1,5 @@
 import { mount } from '@vue/test-utils';
-import Tabs from '..';
+import Tabs, { TabPane } from '..';
-
-const { TabPane } = Tabs;
 
 describe('Tabs', () => {
   describe('editable-card', () => {

components/tag/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Tag from '..';
 import mountTest from '../../../tests/shared/mountTest';
 

components/tooltip/Tooltip.tsx

@@ -1,6 +1,5 @@
 import type { ExtractPropTypes, CSSProperties } from 'vue';
-import { computed, watch } from 'vue';
+import { computed, watch, defineComponent, onMounted, ref } from 'vue';
-import { defineComponent, onMounted, ref } from 'vue';
 import VcTooltip from '../vc-tooltip';
 import classNames from '../_util/classNames';
 import PropTypes from '../_util/vue-types';

components/tooltip/__tests__/tooltip.test.js

@@ -1,4 +1,4 @@
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import { mount } from '@vue/test-utils';
 import Tooltip from '..';
 import mountTest from '../../../tests/shared/mountTest';

components/transfer/__tests__/index.test.js

@@ -1,8 +1,7 @@
 import { mount } from '@vue/test-utils';
 import Transfer from '..';
 import * as Vue from 'vue';
-import { sleep } from '../../../tests/utils';
+import { sleep, asyncExpect } from '../../../tests/utils';
-import { asyncExpect } from '@/tests/utils';
 import mountTest from '../../../tests/shared/mountTest';
 
 const listCommonProps = {

components/transfer/__tests__/search.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect } from '@/tests/utils';
+import { asyncExpect } from '../../../tests/utils';
 import Search from '../search';
 import Transfer from '../index';
 

components/transfer/index.tsx

@@ -1,6 +1,5 @@
 import type { CSSProperties, ExtractPropTypes, PropType } from 'vue';
-import { watchEffect } from 'vue';
+import { watchEffect, defineComponent, ref, watch } from 'vue';
-import { defineComponent, ref, watch } from 'vue';
 import PropTypes from '../_util/vue-types';
 import { getPropsSlot } from '../_util/props-util';
 import classNames from '../_util/classNames';

components/transfer/list.tsx

@@ -8,8 +8,7 @@ import Dropdown from '../dropdown';
 import Search from './search';
 import ListBody from './ListBody';
 import type { VNode, VNodeTypes, ExtractPropTypes, PropType } from 'vue';
-import { watchEffect, computed } from 'vue';
+import { watchEffect, computed, defineComponent, ref } from 'vue';
-import { defineComponent, ref } from 'vue';
 import type { RadioChangeEvent } from '../radio/interface';
 import type { TransferItem } from './index';
 

components/tree-select/index.tsx

@@ -1,6 +1,5 @@
 import type { App, ExtractPropTypes, Plugin, PropType } from 'vue';
-import { computed, ref, watchEffect } from 'vue';
+import { computed, ref, watchEffect, defineComponent } from 'vue';
-import { defineComponent } from 'vue';
 import VcTreeSelect, {
   TreeNode,
   SHOW_ALL,

components/tree/DirectoryTree.tsx

@@ -1,15 +1,12 @@
 import type { ExtractPropTypes, PropType } from 'vue';
-import { nextTick, onUpdated, ref, watch } from 'vue';
+import { nextTick, onUpdated, ref, watch, defineComponent } from 'vue';
-import { defineComponent } from 'vue';
 import debounce from 'lodash-es/debounce';
 import FolderOpenOutlined from '@ant-design/icons-vue/FolderOpenOutlined';
 import FolderOutlined from '@ant-design/icons-vue/FolderOutlined';
 import FileOutlined from '@ant-design/icons-vue/FileOutlined';
 import classNames from '../_util/classNames';
-import type { AntdTreeNodeAttribute } from './Tree';
+import type { AntdTreeNodeAttribute, TreeProps } from './Tree';
-import { treeProps } from './Tree';
+import Tree, { treeProps } from './Tree';
-import type { TreeProps } from './Tree';
-import Tree from './Tree';
 import initDefaultProps from '../_util/props-util/initDefaultProps';
 import { convertDataToEntities, convertTreeToData } from '../vc-tree/utils/treeUtil';
 import type { DataNode, EventDataNode, Key } from '../vc-tree/interface';

components/tree/Tree.tsx

@@ -1,7 +1,5 @@
 import type { PropType, ExtractPropTypes } from 'vue';
-import { watchEffect } from 'vue';
+import { watchEffect, ref, defineComponent } from 'vue';
-import { ref } from 'vue';
-import { defineComponent } from 'vue';
 import classNames from '../_util/classNames';
 import VcTree, { TreeNode } from '../vc-tree';
 import PropTypes from '../_util/vue-types';

components/typography/Base.tsx

@@ -3,7 +3,7 @@ import LocaleReceiver from '../locale-provider/LocaleReceiver';
 import warning from '../_util/warning';
 import TransButton from '../_util/transButton';
 import raf from '../_util/raf';
-import isStyleSupport from '../_util/styleChecker';
+import { isStyleSupport } from '../_util/styleChecker';
 import Editable from './Editable';
 import measure from './util';
 import PropTypes from '../_util/vue-types';

components/typography/__tests__/index.test.js

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils';
-import { asyncExpect, sleep } from '@/tests/utils';
+import { asyncExpect, sleep } from '../../../tests/utils';
 import KeyCode from '../../_util/KeyCode';
 import copy from '../../_util/copy-to-clipboard';
 import Typography from '..';

components/vc-align/Align.tsx

@@ -1,6 +1,14 @@
 import type { PropType } from 'vue';
-import { nextTick } from 'vue';
+import {
-import { defineComponent, ref, computed, onMounted, onUpdated, watch, onUnmounted } from 'vue';
+  nextTick,
+  defineComponent,
+  ref,
+  computed,
+  onMounted,
+  onUpdated,
+  watch,
+  onUnmounted,
+} from 'vue';
 import { alignElement, alignPoint } from 'dom-align';
 import addEventListener from '../vc-util/Dom/addEventListener';
 import { cloneElement } from '../_util/vnode';

components/vc-cascader/Cascader.jsx

@@ -1,11 +1,10 @@
-import { getComponent, getSlot } from '../_util/props-util';
+import { getComponent, getSlot , hasProp, getEvents } from '../_util/props-util';
 import PropTypes from '../_util/vue-types';
 import Trigger from '../vc-trigger';
 import Menus from './Menus';
 import KeyCode from '../_util/KeyCode';
 import arrayTreeFilter from 'array-tree-filter';
 import shallowEqualArrays from 'shallow-equal/arrays';
-import { hasProp, getEvents } from '../_util/props-util';
 import BaseMixin from '../_util/BaseMixin';
 import { cloneElement } from '../_util/vnode';
 import { defineComponent } from 'vue';

components/vc-mentions/src/Mentions.tsx

@@ -1,6 +1,7 @@
 import type { ExtractPropTypes } from 'vue';
-import { toRef, watchEffect } from 'vue';
 import {
+  toRef,
+  watchEffect,
   defineComponent,
   provide,
   withDirectives,

components/vc-picker/hooks/usePickerInput.ts

@@ -1,9 +1,5 @@
 import type { ComputedRef, HTMLAttributes, Ref } from 'vue';
-import { onBeforeUnmount } from 'vue';
+import { onBeforeUnmount, watchEffect, watch, ref, computed } from 'vue';
-import { watchEffect } from 'vue';
-import { watch } from 'vue';
-import { ref } from 'vue';
-import { computed } from 'vue';
 import type { FocusEventHandler } from '../../_util/EventInterface';
 import KeyCode from '../../_util/KeyCode';
 import { addGlobalMousedownEvent, getTargetFromEvent } from '../utils/uiUtil';

components/vc-picker/hooks/useRangeViewDates.ts

@@ -3,9 +3,7 @@ import type { GenerateConfig } from '../generate';
 import { getValue, updateValues } from '../utils/miscUtil';
 import { getClosingViewDate, isSameYear, isSameMonth, isSameDecade } from '../utils/dateUtil';
 import type { Ref } from 'vue';
-import { watch } from 'vue';
+import { watch, computed, ref } from 'vue';
-import { computed } from 'vue';
-import { ref } from 'vue';
 
 function getStartEndDistance<DateType>(
   startDate: DateType,

components/vc-select/Select.tsx

@@ -43,8 +43,7 @@ import {
   fillOptionsWithMissingValue,
 } from './utils/valueUtil';
 import type { SelectProps } from './generate';
-import { selectBaseProps } from './generate';
+import generateSelector, { selectBaseProps } from './generate';
-import generateSelector from './generate';
 import type { DefaultValueType } from './interface/generator';
 import warningProps from './utils/warningPropsUtil';
 import { defineComponent, ref } from 'vue';

components/vc-select/Selector/SingleSelector.tsx

@@ -2,8 +2,7 @@ import pickAttrs from '../../_util/pickAttrs';
 import Input from './Input';
 import type { InnerSelectorProps } from './interface';
 import type { VNodeChild } from 'vue';
-import { Fragment } from 'vue';
+import { Fragment, computed, defineComponent, ref, watch } from 'vue';
-import { computed, defineComponent, ref, watch } from 'vue';
 import PropTypes from '../../_util/vue-types';
 import { useInjectTreeSelectContext } from '../../vc-tree-select/Context';
 

components/vc-select/generate.tsx

@@ -37,8 +37,8 @@ import useSelectTriggerControl from './hooks/useSelectTriggerControl';
 import useCacheDisplayValue from './hooks/useCacheDisplayValue';
 import useCacheOptions from './hooks/useCacheOptions';
 import type { CSSProperties, PropType, VNode, VNodeChild } from 'vue';
-import { getCurrentInstance } from 'vue';
 import {
+  getCurrentInstance,
   computed,
   defineComponent,
   onBeforeUnmount,

components/vc-select/interface/index.ts

@@ -1,10 +1,9 @@
-import type * as Vue from 'vue';
+import type { VNode, VNodeChild, CSSProperties } from 'vue';
-import type { VNode } from 'vue';
 import type { Key, RawValueType } from './generator';
 
 export type RenderDOMFunc = (props: any) => HTMLElement;
 
-export type RenderNode = Vue.VNodeChild | ((props: any) => Vue.VNodeChild);
+export type RenderNode = VNodeChild | ((props: any) => VNodeChild);
 
 export type Mode = 'multiple' | 'tags' | 'combobox';
 
@@ -21,8 +20,8 @@ export interface OptionCoreData {
   value?: Key;
   title?: string;
   class?: string;
-  style?: Vue.CSSProperties;
+  style?: CSSProperties;
-  label?: Vue.VNodeChild;
+  label?: VNodeChild;
   /** @deprecated Only works when use `children` as option data */
   children?: VNode[] | JSX.Element[];
 }
@@ -34,10 +33,10 @@ export interface OptionData extends OptionCoreData {
 
 export interface OptionGroupData {
   key?: Key;
-  label?: Vue.VNodeChild;
+  label?: VNodeChild;
   options: OptionData[];
   class?: string;
-  style?: Vue.CSSProperties;
+  style?: CSSProperties;
 
   /** Save for customize data */
   [prop: string]: any; // eslint-disable-line @typescript-eslint/no-explicit-any

components/vc-slider/src/Handle.tsx

@@ -1,10 +1,8 @@
 import type { CSSProperties } from 'vue';
-import { computed, defineComponent, ref } from 'vue';
+import { computed, defineComponent, ref, onMounted, onBeforeUnmount } from 'vue';
 import classNames from '../../_util/classNames';
 import PropTypes from '../../_util/vue-types';
 import addEventListener from '../../vc-util/Dom/addEventListener';
-import { onMounted } from 'vue';
-import { onBeforeUnmount } from 'vue';
 
 export default defineComponent({
   name: 'Handle',

components/vc-tree-select/hooks/useKeyValueMap.ts

@@ -1,6 +1,5 @@
 import type { ComputedRef, Ref } from 'vue';
-import { ref } from 'vue';
+import { ref, watchEffect } from 'vue';
-import { watchEffect } from 'vue';
 import type { FlattenDataNode, Key, RawValueType } from '../interface';
 
 /**

components/vc-tree-select/props.ts

@@ -1,11 +1,6 @@
 import type { ExtractPropTypes, PropType } from 'vue';
-import type { DataNode } from './interface';
-import { selectBaseProps } from '../vc-select';
-import type { FilterFunc } from '../vc-select/interface/generator';
-import omit from '../_util/omit';
-import type { Key } from '../_util/type';
-import PropTypes from '../_util/vue-types';
 import type {
+  DataNode,
   ChangeEventExtra,
   DefaultValueType,
   FieldNames,
@@ -15,6 +10,11 @@ import type {
   RawValueType,
   SimpleModeConfig,
 } from './interface';
+import { selectBaseProps } from '../vc-select';
+import type { FilterFunc } from '../vc-select/interface/generator';
+import omit from '../_util/omit';
+import type { Key } from '../_util/type';
+import PropTypes from '../_util/vue-types';
 import type { CheckedStrategy } from './utils/strategyUtil';
 
 export function optionListProps<OptionsType>() {

components/vc-tree/MotionTreeNode.tsx

@@ -4,8 +4,16 @@ import type { TreeNodeRequiredProps } from './utils/treeUtil';
 import { getTreeNodeProps } from './utils/treeUtil';
 import { useInjectTreeContext } from './contextTypes';
 import type { PropType } from 'vue';
-import { computed, nextTick } from 'vue';
+import {
-import { defineComponent, onBeforeUnmount, onMounted, ref, Transition, watch } from 'vue';
+  computed,
+  nextTick,
+  defineComponent,
+  onBeforeUnmount,
+  onMounted,
+  ref,
+  Transition,
+  watch,
+} from 'vue';
 import { treeNodeProps } from './props';
 import { collapseMotion } from '../_util/transition';
 

components/vc-tree/contextTypes.ts

@@ -4,9 +4,7 @@
  */
 
 import type { ComputedRef, InjectionKey, PropType } from 'vue';
-import { inject } from 'vue';
+import { inject, computed, defineComponent, provide } from 'vue';
-import { computed } from 'vue';
-import { defineComponent, provide } from 'vue';
 import type { VueNode } from '../_util/type';
 import type {
   IconType,

components/vc-trigger/Popup/useVisibleStatus.ts

@@ -1,7 +1,5 @@
 import type { Ref } from 'vue';
-import { nextTick } from 'vue';
+import { nextTick, onBeforeUnmount, ref, watch } from 'vue';
-import { onBeforeUnmount } from 'vue';
-import { ref, watch } from 'vue';
 import raf from '../../_util/raf';
 
 /**

package.json

@@ -141,6 +141,7 @@
     "eslint": "^7.25.0",
     "eslint-config-prettier": "^8.0.0",
     "eslint-plugin-html": "^6.0.0",
+    "eslint-plugin-import": "^2.24.2",
     "eslint-plugin-jest": "^24.3.6",
     "eslint-plugin-markdown": "^2.0.0",
     "eslint-plugin-no-explicit-type-exports": "^0.11.10",