From 0636e1e24060fda678ec992e64d95aca104ab1aa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= <sxzz@sxzz.moe>
Date: Fri, 17 Sep 2021 15:27:31 +0800
Subject: [PATCH] style: add import and stricter lint (#3440)

* style: add import lint

* chore: apply eslint rules

* chore: add stricter lint

* chore: lint all files

* auto fix

* manually fix

* restore build-indices.ts
---
 .eslintignore                                 |   1 +
 .eslintrc.js                                  |  57 +++-
 build/build-helper.ts                         |  17 +-
 build/build-indices.ts                        | 121 +++++----
 build/crowdin-credentials.ts                  |   5 +-
 build/full-bundle.ts                          |   4 +-
 build/gen-dts.ts                              |   9 +-
 build/gen-entry-dts.ts                        |  11 +-
 build/gulpfile.ts                             |   2 +-
 build/rollup.config.ts                        |   4 +-
 build/size-reporter.ts                        |   2 +-
 build/update-version.ts                       |   2 +-
 build/utils.ts                                |   2 +-
 docs/examples/.eslintrc.js                    |   7 +
 docs/examples/table/summary.vue               |  18 +-
 docs/examples/table/with-status.vue           |  18 +-
 docs/examples/tabs/customized-trigger.vue     |   2 +-
 docs/examples/tabs/dynamic-tabs.vue           |   2 +-
 docs/examples/tag/editable.vue                |  36 +--
 docs/examples/transfer/basic.vue              |  14 +-
 docs/examples/tree/customized-node.vue        |  10 +-
 docs/examples/tree/selectable.vue             |   4 +-
 docs/examples/upload/avatar.vue               |  52 ++--
 package.json                                  |   5 +-
 .../components/affix/__tests__/affix.spec.ts  |   2 +-
 packages/components/alert/src/alert.ts        |   2 +-
 .../__tests__/autocomplete.spec.ts            |   6 +-
 packages/components/autocomplete/index.ts     |   4 +-
 .../components/autocomplete/src/index.vue     |   3 +-
 packages/components/avatar/index.ts           |   2 +-
 packages/components/backtop/index.ts          |   2 +-
 packages/components/button/src/button.vue     |   2 +-
 .../calendar/__tests__/calendar.spec.ts       |   2 +-
 packages/components/calendar/index.ts         |   4 +-
 .../components/calendar/src/date-table.vue    |   5 +-
 packages/components/calendar/src/index.vue    |   2 +-
 .../carousel/__tests__/carousel.spec.ts       |   2 +-
 packages/components/carousel/index.ts         |   4 +-
 packages/components/carousel/src/carousel.ts  |   2 +-
 packages/components/carousel/src/item.vue     |   2 +-
 packages/components/carousel/src/main.vue     |   2 +-
 packages/components/cascader-panel/index.ts   |   4 +-
 .../components/cascader-panel/src/index.vue   |  18 +-
 .../components/cascader-panel/src/menu.vue    |   2 +-
 .../components/cascader-panel/src/node.vue    |   2 +-
 packages/components/cascader/index.ts         |   4 +-
 packages/components/cascader/src/index.vue    |   7 +-
 packages/components/check-tag/index.ts        |   2 +-
 .../checkbox/__tests__/checkbox.spec.ts       |   2 +-
 .../components/checkbox/src/checkbox.type.ts  |   4 +-
 .../collapse/__tests__/collapse.spec.ts       |   2 +-
 packages/components/collapse/index.ts         |   4 +-
 .../components/collapse/src/collapse-item.vue |   3 +-
 .../components/collapse/src/collapse.type.ts  |   2 +-
 packages/components/collapse/src/collapse.vue |   2 +-
 .../__tests__/color-picker.spec.ts            |   3 +-
 .../date-picker/__tests__/date-picker.spec.ts |   6 +-
 .../__tests__/date-time-picker.spec.ts        |   4 +-
 .../src/date-picker-com/basic-date-table.vue  |   2 +-
 .../__tests__/descriptions.spec.ts            |   2 +-
 packages/components/descriptions/src/token.ts |   4 +-
 packages/components/dropdown/src/dropdown.vue |   6 +-
 .../components/form/__tests__/form.spec.ts    |   3 +-
 packages/components/form/src/form-item.vue    |   4 +-
 packages/components/form/src/form.type.ts     |   2 +-
 packages/components/form/src/form.vue         |   3 +-
 packages/components/form/src/label-wrap.ts    |   2 +-
 .../__tests__/image-viewer.spec.ts            |   2 +-
 .../components/image/__tests__/image.spec.ts  |   5 +-
 .../__tests__/infinite-scroll.spec.ts         |   2 +-
 .../components/infinite-scroll/src/index.ts   |   2 +-
 .../__tests__/input-number.spec.ts            |   2 +-
 packages/components/link/src/index.vue        |   3 +-
 .../loading/__tests__/loading.spec.ts         |   2 +-
 packages/components/loading/src/directive.ts  |   4 +-
 .../components/menu/__tests__/menu.spec.ts    |   2 +-
 packages/components/menu/src/menu.ts          |   4 +-
 packages/components/menu/src/useMenu.ts       |   4 +-
 .../message-box/__tests__/message-box.spec.ts |   2 +-
 .../__tests__/notification.spec.ts            |   3 +-
 .../pagination/__tests__/pagination.spec.ts   |   3 +-
 packages/components/popover/src/index.vue     |   3 +-
 .../popper/__tests__/popper.spec.ts           |   4 +-
 packages/components/select-v2/src/token.ts    |   2 +-
 packages/components/select-v2/src/useInput.ts |   2 +-
 .../components/select-v2/src/useSelect.ts     |   4 +-
 packages/components/select/src/option.vue     |   2 +-
 .../components/select/src/select-dropdown.vue |   2 +-
 packages/components/select/src/useSelect.ts   |   9 +-
 packages/components/slider/src/index.vue      |   3 +-
 packages/components/slider/src/useSlide.ts    |   3 +-
 .../components/slider/src/useSliderButton.ts  |   4 +-
 packages/components/slider/src/useStops.ts    |   3 +-
 .../components/table/__tests__/table.spec.ts  |   9 +-
 .../components/table/src/filter-panel.vue     |   3 +-
 packages/components/table/src/store/helper.ts |   3 +-
 packages/components/table/src/store/tree.ts   |   2 +-
 .../table/src/table-body/events-helper.ts     |   2 +-
 .../components/table/src/table-body/index.ts  |   2 +-
 .../table/src/table-body/render-helper.ts     |  10 +-
 .../table/src/table-column/defaults.ts        |   6 +-
 .../table/src/table-column/index.ts           |   3 +-
 .../table/src/table-column/render-helper.ts   |   6 +-
 .../table/src/table-footer/index.ts           |   2 +-
 .../table/src/table-header/index.ts           |   2 +-
 packages/components/table/src/table-layout.ts |   2 +-
 .../table/src/table/style-helper.ts           |   4 +-
 packages/components/tabs/src/tab-bar.vue      |   2 +-
 packages/components/tabs/src/tab-nav.vue      |   2 +-
 .../time-picker/__tests__/time-picker.spec.ts |   2 +-
 .../time-picker-com/basic-time-spinner.vue    |  12 +-
 .../time-select/src/time-select.vue           |   5 +-
 packages/components/transfer/src/index.vue    |   7 +-
 .../transfer/src/useCheckedChange.ts          |   4 +-
 .../components/tree/__tests__/tree.spec.ts    |   4 +-
 packages/components/tree/src/model/node.ts    |   2 +-
 .../components/tree/src/model/useDragNode.ts  |   5 +-
 .../components/tree/src/model/useKeydown.ts   |   2 +-
 .../src/model/useNodeExpandEventBroadcast.ts  |   2 +-
 packages/components/tree/src/model/util.ts    |   2 +-
 packages/components/tree/src/tree-node.vue    |   2 +-
 packages/components/tree/src/tree.type.ts     |  13 +-
 packages/components/tree/src/tree.vue         |   2 +-
 .../components/upload/src/upload-dragger.vue  |   2 +-
 .../src/components/dynamic-size-grid.ts       |   2 +-
 .../src/components/dynamic-size-list.ts       |   2 +-
 .../src/components/fixed-size-grid.ts         |   6 +-
 .../src/components/fixed-size-list.ts         |   2 +-
 .../__tests__/click-outside.spec.ts           |   2 +-
 .../directives/__tests__/repeat-click.spec.ts |   2 +-
 .../directives/__tests__/trap-focus.spec.ts   |   5 +-
 packages/directives/gulpfile.ts               |   2 +-
 packages/hooks/__tests__/use-css-var.spec.ts  |   2 +-
 packages/hooks/gulpfile.ts                    |   2 +-
 packages/hooks/use-attrs/index.ts             |   2 +-
 packages/hooks/use-migrating/index.ts         |   2 +-
 packages/locale/gulpfile.ts                   |   2 +-
 packages/locale/index.ts                      |   2 +-
 packages/test-utils/define-getter.ts          |   2 +-
 packages/theme-chalk/gulpfile.ts              |   3 +-
 packages/tokens/gulpfile.ts                   |   2 +-
 packages/utils/dom.ts                         |   2 +-
 packages/utils/gulpfile.ts                    |   2 +-
 packages/utils/menu/submenu.ts                |   2 +-
 packages/utils/vnode.ts                       |   2 +-
 typings/vue-test-utils.d.ts                   |   4 +-
 yarn.lock                                     | 243 +++++++++++++++++-
 147 files changed, 669 insertions(+), 387 deletions(-)
 create mode 100644 docs/examples/.eslintrc.js

diff --git a/.eslintignore b/.eslintignore
index 9442ad986c501..8a0079a68e696 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -1,3 +1,4 @@
 node_modules
+dist
 packages/*/es
 packages/*/lib
diff --git a/.eslintrc.js b/.eslintrc.js
index 64d5e731e2ff0..3888eeb20935d 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -12,8 +12,12 @@ module.exports = {
     browser: true,
     node: true,
   },
-  plugins: ['@typescript-eslint', 'prettier'],
+  globals: {
+    jest: 'readonly',
+  },
+  plugins: ['@typescript-eslint', 'prettier', 'import'],
   extends: [
+    'eslint:recommended',
     'plugin:@typescript-eslint/recommended',
     'plugin:vue/vue3-recommended',
     'prettier',
@@ -26,7 +30,6 @@ module.exports = {
       },
     },
     {
-      // not tested
       files: ['**/__tests__/**'],
       rules: {
         'no-console': 'off',
@@ -44,6 +47,9 @@ module.exports = {
     camelcase: ['error', { properties: 'never' }],
 
     'no-var': 'error',
+    'no-empty': ['error', { allowEmptyCatch: true }],
+    'no-with': 'error',
+    'no-void': 'error',
     'prefer-const': [
       'warn',
       { destructuring: 'all', ignoreReadBeforeAssign: true },
@@ -55,20 +61,59 @@ module.exports = {
       { ignoreConstructors: false, avoidQuotes: true },
     ],
     'block-scoped-var': 'error',
-    complexity: ['off', 11],
-    'no-with': 'error',
-    'no-void': 'error',
+    'no-constant-condition': ['error', { checkLoops: false }],
 
     '@typescript-eslint/explicit-module-boundary-types': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-non-null-assertion': 'off',
     '@typescript-eslint/no-non-null-asserted-optional-chain': 'off',
+    '@typescript-eslint/consistent-type-imports': [
+      'error',
+      { disallowTypeAnnotations: false },
+    ],
 
     // vue
     'vue/no-v-html': 'off',
     'vue/require-default-prop': 'off',
     'vue/require-explicit-emits': 'off',
 
-    'prettier/prettier': 'warn',
+    'prettier/prettier': 'error',
+
+    // import
+    'import/first': 'error',
+    'import/no-duplicates': 'error',
+    'import/order': [
+      'error',
+      {
+        groups: [
+          'builtin',
+          'external',
+          'internal',
+          'parent',
+          'sibling',
+          'index',
+          'object',
+          'type',
+        ],
+
+        pathGroups: [
+          {
+            pattern: 'vue',
+            group: 'external',
+            position: 'before',
+          },
+          {
+            pattern: '@vue/**',
+            group: 'external',
+            position: 'before',
+          },
+          {
+            pattern: '@element-plus/**',
+            group: 'internal',
+          },
+        ],
+        pathGroupsExcludedImportTypes: ['type'],
+      },
+    ],
   },
 }
diff --git a/build/build-helper.ts b/build/build-helper.ts
index 0bb26f5527cba..615d67a1ccd7c 100644
--- a/build/build-helper.ts
+++ b/build/build-helper.ts
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-import helper from 'components-helper'
 import path from 'path'
+import helper from 'components-helper'
 import { epRoot } from './paths'
 
 const { name, version } = require(path.resolve(epRoot, './package.json'))
@@ -30,13 +30,10 @@ helper({
 })
 
 function reComponentName(title) {
-  return (
-    'el-' +
-    title
-      .replace(/\B([A-Z])/g, '-$1')
-      .replace(/[ ]+/g, '-')
-      .toLowerCase()
-  )
+  return `el-${title
+    .replace(/\B([A-Z])/g, '-$1')
+    .replace(/[ ]+/g, '-')
+    .toLowerCase()}`
 }
 
 function reDocUrl(fileName, header) {
@@ -44,10 +41,10 @@ function reDocUrl(fileName, header) {
   const _header = header
     ? header.replace(/[ ]+/g, '-').toLowerCase()
     : undefined
-  return docs + fileName + (_header ? '#' + _header : '')
+  return docs + fileName + (_header ? `#${_header}` : '')
 }
 
-function reAttribute(value, key, item) {
+function reAttribute(value, key /* , item */) {
   const _value = value.match(/^\*\*(.*)\*\*$/)
   const str = _value ? _value[1] : value
 
diff --git a/build/build-indices.ts b/build/build-indices.ts
index e3391f6dc0e6e..2a48ba5039106 100644
--- a/build/build-indices.ts
+++ b/build/build-indices.ts
@@ -1,66 +1,65 @@
-/* eslint-disable @typescript-eslint/no-var-requires */
-'use strict'
+// TODO: implement this feature
 
-import fs from 'fs'
-import algoliasearch from 'algoliasearch'
-import fg from 'fast-glob'
+// import fs from 'fs'
+// import algoliasearch from 'algoliasearch'
+// import fg from 'fast-glob'
 
-interface Index {
-  component: string
-  title: string
-  anchor: string
-  content: string
-  sort: number
-  path: string
-}
+// interface Index {
+//   component: string
+//   title: string
+//   anchor: string
+//   content: string
+//   sort: number
+//   path: string
+// }
 
-const algoliaKey = process.env.ALGOLIA_KEY!
+// const algoliaKey = process.env.ALGOLIA_KEY!
 
-const client = algoliasearch('7DCTSU0WBW', algoliaKey)
-const langs = {
-  'zh-CN': 'element-zh',
-  'en-US': 'element-en',
-  es: 'element-es',
-  'fr-FR': 'element-fr',
-  jp: 'element-jp',
-}
-;['zh-CN', 'en-US', 'es', 'fr-FR', 'jp'].forEach((lang) => {
-  const indexName = langs[lang]
-  const index = client.initIndex(indexName)
-  index
-    .clearObjects()
-    .then(() => {
-      const files = fg.sync(`website/docs/${lang}/*.md`)
-      let indices: Index[] = []
-      files.forEach((file) => {
-        const regExp = new RegExp(`website\/docs\/${lang}\/(.*).md`)
-        const pathContent = file.match(regExp)!
-        const path = pathContent[1]
-        const index = path.lastIndexOf('/')
-        const names = index !== -1 ? path.split('/') : []
-        const component = names.length ? names[names.length - 1] : path
-        const content = fs.readFileSync(file, 'utf8')
-        const matches = content
-          .replace(/:::[\s\S]*?:::/g, '')
-          .replace(/```[\s\S]*?```/g, '')
-          .match(/#{2,4}[^#]*/g)!
-          .map((match) =>
-            match
-              .replace(/\n+/g, '\n')
-              .split('\n')
-              .filter((part) => !!part)
-          )
-      })
+// const client = algoliasearch('7DCTSU0WBW', algoliaKey)
+// const langs = {
+//   'zh-CN': 'element-zh',
+//   'en-US': 'element-en',
+//   es: 'element-es',
+//   'fr-FR': 'element-fr',
+//   jp: 'element-jp',
+// }
+// ;['zh-CN', 'en-US', 'es', 'fr-FR', 'jp'].forEach((lang) => {
+//   const indexName = langs[lang]
+//   const index = client.initIndex(indexName)
+//   index
+//     .clearObjects()
+//     .then(() => {
+//       const files = fg.sync(`website/docs/${lang}/*.md`)
+//       let indices: Index[] = []
+//       files.forEach((file) => {
+//         const regExp = new RegExp(`website\/docs\/${lang}\/(.*).md`)
+//         const pathContent = file.match(regExp)!
+//         const path = pathContent[1]
+//         const index = path.lastIndexOf('/')
+//         const names = index !== -1 ? path.split('/') : []
+//         const component = names.length ? names[names.length - 1] : path
+//         const content = fs.readFileSync(file, 'utf8')
+//         const matches = content
+//           .replace(/:::[\s\S]*?:::/g, '')
+//           .replace(/```[\s\S]*?```/g, '')
+//           .match(/#{2,4}[^#]*/g)!
+//           .map((match) =>
+//             match
+//               .replace(/\n+/g, '\n')
+//               .split('\n')
+//               .filter((part) => !!part)
+//           )
+//       })
 
-      index
-        .saveObjects(indices, {
-          autoGenerateObjectIDIfNotExist: true,
-        })
-        .catch((e) => {
-          console.log(e)
-        })
-    })
-    .catch((e) => {
-      console.log(e)
-    })
-})
+//       index
+//         .saveObjects(indices, {
+//           autoGenerateObjectIDIfNotExist: true,
+//         })
+//         .catch((e) => {
+//           console.log(e)
+//         })
+//     })
+//     .catch((e) => {
+//       console.log(e)
+//     })
+// })
diff --git a/build/crowdin-credentials.ts b/build/crowdin-credentials.ts
index bb23ef886891c..f6bb3fb0f215d 100644
--- a/build/crowdin-credentials.ts
+++ b/build/crowdin-credentials.ts
@@ -1,6 +1,7 @@
 import path from 'path'
 import fs from 'fs'
 import chalk from 'chalk'
+import { errorAndExit } from './utils'
 
 const credentialPlaceholder = 'API_TOKEN_PLACEHOLDER'
 
@@ -18,7 +19,7 @@ const CREDENTIAL = process.env.CROWDIN_TOKEN
       file.replace(credentialPlaceholder, CREDENTIAL!)
     )
     console.info(chalk.green('Crowdin credential update successfully'))
-  } catch (e) {
-    throw e
+  } catch (e: any) {
+    errorAndExit(e)
   }
 })()
diff --git a/build/full-bundle.ts b/build/full-bundle.ts
index 22e3ab47e3562..f45013b6805e3 100644
--- a/build/full-bundle.ts
+++ b/build/full-bundle.ts
@@ -1,8 +1,8 @@
+import path from 'path'
+import fs from 'fs'
 import { nodeResolve } from '@rollup/plugin-node-resolve'
 import rollup from 'rollup'
 import chalk from 'chalk'
-import path from 'path'
-import fs from 'fs'
 import commonjs from '@rollup/plugin-commonjs'
 import vue from 'rollup-plugin-vue'
 import esbuild from 'rollup-plugin-esbuild'
diff --git a/build/gen-dts.ts b/build/gen-dts.ts
index e122191bdf443..1c679110cc958 100644
--- a/build/gen-dts.ts
+++ b/build/gen-dts.ts
@@ -1,9 +1,10 @@
 import path from 'path'
 import fs from 'fs'
-import { Project, SourceFile } from 'ts-morph'
 import vueCompiler from '@vue/compiler-sfc'
+import { Project } from 'ts-morph'
 import { sync as globSync } from 'fast-glob'
 import chalk from 'chalk'
+import type { SourceFile } from 'ts-morph'
 
 const TSCONFIG_PATH = path.resolve(__dirname, '../tsconfig.json')
 
@@ -130,9 +131,9 @@ const genVueTypes = async (
       )
       console.log(
         chalk.green(
-          'Definition for file: ' +
-            chalk.bold(sourceFile.getBaseName()) +
-            ' generated'
+          `Definition for file: ${chalk.bold(
+            sourceFile.getBaseName()
+          )} generated`
         )
       )
     }
diff --git a/build/gen-entry-dts.ts b/build/gen-entry-dts.ts
index f2680aa6e54a4..898758a2baae1 100644
--- a/build/gen-entry-dts.ts
+++ b/build/gen-entry-dts.ts
@@ -2,12 +2,13 @@ import path from 'path'
 import fs from 'fs'
 import chalk from 'chalk'
 import glob from 'fast-glob'
-import { Project, SourceFile } from 'ts-morph'
+import { Project } from 'ts-morph'
 import { epRoot, buildOutput } from './paths'
+import type { SourceFile } from 'ts-morph'
 const TSCONFIG_PATH = path.resolve(__dirname, '../tsconfig.dts.json')
 
 const gen = async () => {
-  const files = await glob(epRoot + '/*.ts')
+  const files = await glob(`${epRoot}/*.ts`)
   const project = new Project({
     compilerOptions: {
       allowJs: true,
@@ -51,9 +52,9 @@ const gen = async () => {
       )
       console.log(
         chalk.green(
-          'Definition for file: ' +
-            chalk.bold(sourceFile.getBaseName()) +
-            ' generated'
+          `Definition for file: ${chalk.bold(
+            sourceFile.getBaseName()
+          )} generated`
         )
       )
     }
diff --git a/build/gulpfile.ts b/build/gulpfile.ts
index a56c3438765ae..4b92ec50501ab 100644
--- a/build/gulpfile.ts
+++ b/build/gulpfile.ts
@@ -1,6 +1,6 @@
+import path from 'path'
 import gulp from 'gulp'
 import ts from 'gulp-typescript'
-import path from 'path'
 import through2 from 'through2'
 
 const output = path.resolve(__dirname, '../dist/styles')
diff --git a/build/rollup.config.ts b/build/rollup.config.ts
index c36085762b658..7d96e6b105aee 100644
--- a/build/rollup.config.ts
+++ b/build/rollup.config.ts
@@ -1,8 +1,8 @@
+import path from 'path'
 import vue from 'rollup-plugin-vue'
 import css from 'rollup-plugin-css-only'
 import { nodeResolve } from '@rollup/plugin-node-resolve'
 import esbuild from 'rollup-plugin-esbuild'
-import path from 'path'
 import { getPackagesSync } from '@lerna/project'
 import pkg from '../package.json'
 
@@ -61,7 +61,7 @@ export default inputs.map((name: string) => ({
     return (
       /^vue/.test(id) ||
       /^@element-plus/.test(id) ||
-      deps.some((k) => new RegExp('^' + k).test(id))
+      deps.some((k) => new RegExp(`^${k}`).test(id))
     )
   },
 }))
diff --git a/build/size-reporter.ts b/build/size-reporter.ts
index a66c2e10a4072..d0ca168296bf2 100644
--- a/build/size-reporter.ts
+++ b/build/size-reporter.ts
@@ -1,5 +1,5 @@
 import chalk from 'chalk'
-import { FileSizeReporter } from 'rollup-plugin-filesize'
+import type { FileSizeReporter } from 'rollup-plugin-filesize'
 
 const reporter: FileSizeReporter = (opt, outputOptions, info) => {
   const values = [
diff --git a/build/update-version.ts b/build/update-version.ts
index 22d15491fac75..3a818e304d545 100644
--- a/build/update-version.ts
+++ b/build/update-version.ts
@@ -1,6 +1,6 @@
-import chalk from 'chalk'
 import path from 'path'
 import fs from 'fs'
+import chalk from 'chalk'
 import { epRoot } from './paths'
 
 const tagVersion = process.env.TAG_VERSION
diff --git a/build/utils.ts b/build/utils.ts
index 14d851dd492ac..d1d4d01f0b7c9 100644
--- a/build/utils.ts
+++ b/build/utils.ts
@@ -27,7 +27,7 @@ export const getExternals = (options: { full: boolean }) => (id: string) => {
   }
 
   return [...new Set(packages)].some(
-    (pkg) => id === pkg || id.startsWith(`${pkg}\/`)
+    (pkg) => id === pkg || id.startsWith(`${pkg}/`)
   )
 }
 
diff --git a/docs/examples/.eslintrc.js b/docs/examples/.eslintrc.js
new file mode 100644
index 0000000000000..d99509b753e00
--- /dev/null
+++ b/docs/examples/.eslintrc.js
@@ -0,0 +1,7 @@
+module.exports = {
+  rules: {
+    'no-console': 'off',
+    'no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': 'off',
+  },
+}
diff --git a/docs/examples/table/summary.vue b/docs/examples/table/summary.vue
index abd1f0f47423e..620862fc1deee 100644
--- a/docs/examples/table/summary.vue
+++ b/docs/examples/table/summary.vue
@@ -77,16 +77,14 @@ export default {
         }
         const values = data.map((item) => Number(item[column.property]))
         if (!values.every((value) => isNaN(value))) {
-          sums[index] =
-            '$ ' +
-            values.reduce((prev, curr) => {
-              const value = Number(curr)
-              if (!isNaN(value)) {
-                return prev + curr
-              } else {
-                return prev
-              }
-            }, 0)
+          sums[index] = `$ ${values.reduce((prev, curr) => {
+            const value = Number(curr)
+            if (!isNaN(value)) {
+              return prev + curr
+            } else {
+              return prev
+            }
+          }, 0)}`
         } else {
           sums[index] = 'N/A'
         }
diff --git a/docs/examples/table/with-status.vue b/docs/examples/table/with-status.vue
index a87b5925177ec..7eba3a4363488 100644
--- a/docs/examples/table/with-status.vue
+++ b/docs/examples/table/with-status.vue
@@ -10,15 +10,6 @@
   </el-table>
 </template>
 
-<style>
-.el-table .warning-row {
-  --el-table-tr-background-color: var(--el-color-warning-lighter);
-}
-.el-table .success-row {
-  --el-table-tr-background-color: var(--el-color-success-lighter);
-}
-</style>
-
 <script lang="ts">
 export default {
   data() {
@@ -59,3 +50,12 @@ export default {
   },
 }
 </script>
+
+<style>
+.el-table .warning-row {
+  --el-table-tr-background-color: var(--el-color-warning-lighter);
+}
+.el-table .success-row {
+  --el-table-tr-background-color: var(--el-color-success-lighter);
+}
+</style>
diff --git a/docs/examples/tabs/customized-trigger.vue b/docs/examples/tabs/customized-trigger.vue
index 76a6613a4707d..ba18061ff1f44 100644
--- a/docs/examples/tabs/customized-trigger.vue
+++ b/docs/examples/tabs/customized-trigger.vue
@@ -42,7 +42,7 @@ export default {
   },
   methods: {
     addTab(targetName) {
-      const newTabName = ++this.tabIndex + ''
+      const newTabName = `${++this.tabIndex}`
       this.editableTabs.push({
         title: 'New Tab',
         name: newTabName,
diff --git a/docs/examples/tabs/dynamic-tabs.vue b/docs/examples/tabs/dynamic-tabs.vue
index 52800d1e4371c..32e9f0a725464 100644
--- a/docs/examples/tabs/dynamic-tabs.vue
+++ b/docs/examples/tabs/dynamic-tabs.vue
@@ -38,7 +38,7 @@ export default {
   methods: {
     handleTabsEdit(targetName, action) {
       if (action === 'add') {
-        const newTabName = ++this.tabIndex + ''
+        const newTabName = `${++this.tabIndex}`
         this.editableTabs.push({
           title: 'New Tab',
           name: newTabName,
diff --git a/docs/examples/tag/editable.vue b/docs/examples/tag/editable.vue
index 38cddb91fe320..bf6add7b663f6 100644
--- a/docs/examples/tag/editable.vue
+++ b/docs/examples/tag/editable.vue
@@ -23,24 +23,6 @@
   >
 </template>
 
-<style>
-.el-tag + .el-tag {
-  margin-left: 10px;
-}
-.button-new-tag {
-  margin-left: 10px;
-  height: 32px;
-  line-height: 30px;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-.input-new-tag {
-  width: 90px;
-  margin-left: 10px;
-  vertical-align: bottom;
-}
-</style>
-
 <script lang="ts">
 export default {
   data() {
@@ -73,3 +55,21 @@ export default {
   },
 }
 </script>
+
+<style>
+.el-tag + .el-tag {
+  margin-left: 10px;
+}
+.button-new-tag {
+  margin-left: 10px;
+  height: 32px;
+  line-height: 30px;
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.input-new-tag {
+  width: 90px;
+  margin-left: 10px;
+  vertical-align: bottom;
+}
+</style>
diff --git a/docs/examples/transfer/basic.vue b/docs/examples/transfer/basic.vue
index 46256d929de74..067dd64db3879 100644
--- a/docs/examples/transfer/basic.vue
+++ b/docs/examples/transfer/basic.vue
@@ -59,13 +59,6 @@
   </div>
 </template>
 
-<style>
-.transfer-footer {
-  margin-left: 20px;
-  padding: 6px 5px;
-}
-</style>
-
 <script lang="ts">
 export default {
   data() {
@@ -97,3 +90,10 @@ export default {
   },
 }
 </script>
+
+<style>
+.transfer-footer {
+  margin-left: 20px;
+  padding: 6px 5px;
+}
+</style>
diff --git a/docs/examples/tree/customized-node.vue b/docs/examples/tree/customized-node.vue
index c4a575cd26a51..0819e54401712 100644
--- a/docs/examples/tree/customized-node.vue
+++ b/docs/examples/tree/customized-node.vue
@@ -3,7 +3,7 @@
     <div class="block">
       <p>Using render-content</p>
       <el-tree
-        :data="data"
+        :data="dataSource"
         show-checkbox
         node-key="id"
         default-expand-all
@@ -14,7 +14,7 @@
     <div class="block">
       <p>Using scoped slot</p>
       <el-tree
-        :data="data"
+        :data="dataSource"
         show-checkbox
         node-key="id"
         default-expand-all
@@ -90,7 +90,7 @@ export default {
       },
     ]
     return {
-      data: JSON.parse(JSON.stringify(data)),
+      dataSource: JSON.parse(JSON.stringify(data)),
     }
   },
 
@@ -101,7 +101,7 @@ export default {
         data.children = []
       }
       data.children.push(newChild)
-      this.data = [...this.data]
+      this.dataSource = [...this.dataSource]
     },
 
     remove(node, data) {
@@ -109,7 +109,7 @@ export default {
       const children = parent.data.children || parent.data
       const index = children.findIndex((d) => d.id === data.id)
       children.splice(index, 1)
-      this.data = [...this.data]
+      this.dataSource = [...this.dataSource]
     },
 
     renderContent(h, { node, data, store }) {
diff --git a/docs/examples/tree/selectable.vue b/docs/examples/tree/selectable.vue
index 567fa56e04a3f..9ee9a997f57d4 100644
--- a/docs/examples/tree/selectable.vue
+++ b/docs/examples/tree/selectable.vue
@@ -46,10 +46,10 @@ export default {
         if (hasChild) {
           data = [
             {
-              name: 'zone' + this.count++,
+              name: `zone${this.count++}`,
             },
             {
-              name: 'zone' + this.count++,
+              name: `zone${this.count++}`,
             },
           ]
         } else {
diff --git a/docs/examples/upload/avatar.vue b/docs/examples/upload/avatar.vue
index 75f542c0751a0..acabd31151493 100644
--- a/docs/examples/upload/avatar.vue
+++ b/docs/examples/upload/avatar.vue
@@ -11,32 +11,6 @@
   </el-upload>
 </template>
 
-<style>
-.avatar-uploader .el-upload {
-  border: 1px dashed #d9d9d9;
-  border-radius: 6px;
-  cursor: pointer;
-  position: relative;
-  overflow: hidden;
-}
-.avatar-uploader .el-upload:hover {
-  border-color: #409eff;
-}
-.avatar-uploader-icon {
-  font-size: 28px;
-  color: #8c939d;
-  width: 178px;
-  height: 178px;
-  line-height: 178px;
-  text-align: center;
-}
-.avatar {
-  width: 178px;
-  height: 178px;
-  display: block;
-}
-</style>
-
 <script lang="ts">
 export default {
   data() {
@@ -63,3 +37,29 @@ export default {
   },
 }
 </script>
+
+<style>
+.avatar-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+.avatar-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 178px;
+  height: 178px;
+  line-height: 178px;
+  text-align: center;
+}
+.avatar {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
+</style>
diff --git a/package.json b/package.json
index a2c8f60ad1a1e..4d0646f86f79e 100644
--- a/package.json
+++ b/package.json
@@ -25,8 +25,8 @@
     "build:tokens": "cd packages/tokens && yarn clean && yarn build",
     "build:full-bundle": "esno build/full-bundle.ts",
     "format": "prettier --write .",
-    "lint": "eslint ./packages --ext .vue,.js,.ts,.jsx,.tsx && prettier --check .",
-    "lint:fix": "eslint --fix ./packages --ext .vue,.js,.ts,.jsx,.tsx && prettier --write .",
+    "lint": "eslint . --ext .vue,.js,.ts,.jsx,.tsx && prettier --check .",
+    "lint:fix": "eslint --fix . --ext .vue,.js,.ts,.jsx,.tsx && prettier --write .",
     "prepare": "husky install",
     "docs:dev": "if [ ! -d \"dist/element-plus\" ]; then sh scripts/build.sh; fi && yarn docs:gen-locale && cd docs && yarn dev",
     "docs:build": "cd docs && yarn build",
@@ -99,6 +99,7 @@
     "esbuild": "^0.12.25",
     "eslint": "^7.7.0",
     "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-import": "^2.24.2",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-vue": "^7.0.0-beta.0",
     "esno": "^0.9.1",
diff --git a/packages/components/affix/__tests__/affix.spec.ts b/packages/components/affix/__tests__/affix.spec.ts
index bb0784f477aa6..4fb0c69c553cb 100644
--- a/packages/components/affix/__tests__/affix.spec.ts
+++ b/packages/components/affix/__tests__/affix.spec.ts
@@ -1,7 +1,7 @@
+import { nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
 import { defineGetter, makeScroll } from '@element-plus/test-utils'
 import Affix from '../src/affix.vue'
-import { nextTick } from 'vue'
 
 let clientHeightRestore: () => void
 
diff --git a/packages/components/alert/src/alert.ts b/packages/components/alert/src/alert.ts
index 051e44a561d2b..503689114cf28 100644
--- a/packages/components/alert/src/alert.ts
+++ b/packages/components/alert/src/alert.ts
@@ -1,5 +1,5 @@
-import type { ExtractPropTypes } from 'vue'
 import { buildProp, keyOf } from '@element-plus/utils/props'
+import type { ExtractPropTypes } from 'vue'
 
 export type AlertEffect = 'light' | 'dark'
 
diff --git a/packages/components/autocomplete/__tests__/autocomplete.spec.ts b/packages/components/autocomplete/__tests__/autocomplete.spec.ts
index 37bc49069e26e..dc31f3fa18816 100644
--- a/packages/components/autocomplete/__tests__/autocomplete.spec.ts
+++ b/packages/components/autocomplete/__tests__/autocomplete.spec.ts
@@ -1,11 +1,11 @@
 import { mount } from '@vue/test-utils'
-import { sleep } from '@element-plus/test-utils'
 import { NOOP } from '@vue/shared'
-
-jest.unmock('lodash/debounce')
+import { sleep } from '@element-plus/test-utils'
 
 import Autocomplete from '../src/index.vue'
 
+jest.unmock('lodash/debounce')
+
 const _mount = (payload = {}) =>
   mount({
     components: {
diff --git a/packages/components/autocomplete/index.ts b/packages/components/autocomplete/index.ts
index 1983d79047118..da2cfca19650c 100644
--- a/packages/components/autocomplete/index.ts
+++ b/packages/components/autocomplete/index.ts
@@ -1,6 +1,6 @@
-import { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils/types'
 import Autocomplete from './src/index.vue'
+import type { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 
 Autocomplete.install = (app: App): void => {
   app.component(Autocomplete.name, Autocomplete)
diff --git a/packages/components/autocomplete/src/index.vue b/packages/components/autocomplete/src/index.vue
index 380c1dba43e88..1b18dc3ca16be 100644
--- a/packages/components/autocomplete/src/index.vue
+++ b/packages/components/autocomplete/src/index.vue
@@ -107,7 +107,8 @@ import { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'
 import { throwError } from '@element-plus/utils/error'
 import ElInput from '@element-plus/components/input'
 import ElScrollbar from '@element-plus/components/scrollbar'
-import ElPopper, { Effect, Placement } from '@element-plus/components/popper'
+import ElPopper, { Effect } from '@element-plus/components/popper'
+import type { Placement } from '@element-plus/components/popper'
 
 import type { PropType } from 'vue'
 
diff --git a/packages/components/avatar/index.ts b/packages/components/avatar/index.ts
index 9ca8e85c0ebfb..10c479505cdf0 100644
--- a/packages/components/avatar/index.ts
+++ b/packages/components/avatar/index.ts
@@ -1,5 +1,5 @@
-import Avatar from './src/avatar.vue'
 import { withInstall } from '@element-plus/utils/with-install'
+import Avatar from './src/avatar.vue'
 
 export const ElAvatar = withInstall(Avatar)
 export default ElAvatar
diff --git a/packages/components/backtop/index.ts b/packages/components/backtop/index.ts
index 18502bc68ad37..2ec05ac1e58f3 100644
--- a/packages/components/backtop/index.ts
+++ b/packages/components/backtop/index.ts
@@ -1,5 +1,5 @@
-import { App } from 'vue'
 import Backtop from './src/index.vue'
+import type { App } from 'vue'
 
 import type { SFCWithInstall } from '@element-plus/utils/types'
 
diff --git a/packages/components/button/src/button.vue b/packages/components/button/src/button.vue
index a3d0457e365ca..f388b4a28ba03 100644
--- a/packages/components/button/src/button.vue
+++ b/packages/components/button/src/button.vue
@@ -24,8 +24,8 @@
 </template>
 
 <script lang="ts">
-import isEmpty from 'lodash/isEmpty'
 import { computed, inject, defineComponent } from 'vue'
+import isEmpty from 'lodash/isEmpty'
 import { useFormItem } from '@element-plus/hooks'
 import { elButtonGroupKey, elFormKey } from '@element-plus/tokens'
 
diff --git a/packages/components/calendar/__tests__/calendar.spec.ts b/packages/components/calendar/__tests__/calendar.spec.ts
index 298e83dd7c972..dffacf47aa8d1 100644
--- a/packages/components/calendar/__tests__/calendar.spec.ts
+++ b/packages/components/calendar/__tests__/calendar.spec.ts
@@ -1,5 +1,5 @@
-import { mount } from '@vue/test-utils'
 import { nextTick } from 'vue'
+import { mount } from '@vue/test-utils'
 import Calendar from '../src/index.vue'
 
 const _mount = (template: string, data?, otherObj?) =>
diff --git a/packages/components/calendar/index.ts b/packages/components/calendar/index.ts
index 8d6261b39d31d..ec5b3e2e718cf 100644
--- a/packages/components/calendar/index.ts
+++ b/packages/components/calendar/index.ts
@@ -1,6 +1,6 @@
-import { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils/types'
 import Calendar from './src/index.vue'
+import type { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 
 Calendar.install = (app: App): void => {
   app.component(Calendar.name, Calendar)
diff --git a/packages/components/calendar/src/date-table.vue b/packages/components/calendar/src/date-table.vue
index 8ebd057377186..2bb795d2b7e9d 100644
--- a/packages/components/calendar/src/date-table.vue
+++ b/packages/components/calendar/src/date-table.vue
@@ -38,11 +38,12 @@
 
 <script lang="ts">
 import { computed, defineComponent, ref } from 'vue'
-import { PropType } from 'vue'
-import dayjs, { Dayjs } from 'dayjs'
+import dayjs from 'dayjs'
 import localeData from 'dayjs/plugin/localeData'
 import { useLocaleInject } from '@element-plus/hooks'
 import { rangeArr } from '@element-plus/components/time-picker'
+import type { Dayjs } from 'dayjs'
+import type { PropType } from 'vue'
 dayjs.extend(localeData)
 
 export const getPrevMonthLastDays = (date: Dayjs, amount) => {
diff --git a/packages/components/calendar/src/index.vue b/packages/components/calendar/src/index.vue
index 18ed647376214..6105bf1996494 100644
--- a/packages/components/calendar/src/index.vue
+++ b/packages/components/calendar/src/index.vue
@@ -48,13 +48,13 @@
 
 <script lang="ts">
 import { ref, computed, defineComponent } from 'vue'
-import type { PropType, ComputedRef } from 'vue'
 import dayjs from 'dayjs'
 
 import ElButton from '@element-plus/components/button'
 import { useLocaleInject } from '@element-plus/hooks'
 import { debugWarn } from '@element-plus/utils/error'
 import DateTable from './date-table.vue'
+import type { PropType, ComputedRef } from 'vue'
 
 import type { Dayjs } from 'dayjs'
 
diff --git a/packages/components/carousel/__tests__/carousel.spec.ts b/packages/components/carousel/__tests__/carousel.spec.ts
index c623ec0b1d94a..b147a16695c7b 100644
--- a/packages/components/carousel/__tests__/carousel.spec.ts
+++ b/packages/components/carousel/__tests__/carousel.spec.ts
@@ -1,5 +1,5 @@
-import { mount } from '@vue/test-utils'
 import { nextTick } from 'vue'
+import { mount } from '@vue/test-utils'
 import Carousel from '../src/main.vue'
 import CarouselItem from '../src/item.vue'
 
diff --git a/packages/components/carousel/index.ts b/packages/components/carousel/index.ts
index 9866acdebf6d2..23d881ba1b153 100644
--- a/packages/components/carousel/index.ts
+++ b/packages/components/carousel/index.ts
@@ -1,7 +1,7 @@
-import { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils/types'
 import Carousel from './src/main.vue'
 import CarouselItem from './src/item.vue'
+import type { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 
 Carousel.install = (app: App): void => {
   app.component(Carousel.name, Carousel)
diff --git a/packages/components/carousel/src/carousel.ts b/packages/components/carousel/src/carousel.ts
index 783f2e3230f38..c96cac3bf121f 100644
--- a/packages/components/carousel/src/carousel.ts
+++ b/packages/components/carousel/src/carousel.ts
@@ -1,4 +1,4 @@
-import { Ref, ToRefs, UnwrapRef } from 'vue'
+import type { Ref, ToRefs, UnwrapRef } from 'vue'
 
 export interface ICarouselItemProps {
   name: string
diff --git a/packages/components/carousel/src/item.vue b/packages/components/carousel/src/item.vue
index ac88e889ab976..f41b529738e81 100644
--- a/packages/components/carousel/src/item.vue
+++ b/packages/components/carousel/src/item.vue
@@ -32,9 +32,9 @@ import {
   onUnmounted,
 } from 'vue'
 import { autoprefixer } from '@element-plus/utils/util'
+import { debugWarn } from '@element-plus/utils/error'
 import type { CSSProperties } from 'vue'
 import type { InjectCarouselScope, ICarouselItemProps } from './carousel'
-import { debugWarn } from '@element-plus/utils/error'
 
 const CARD_SCALE = 0.83
 export default defineComponent({
diff --git a/packages/components/carousel/src/main.vue b/packages/components/carousel/src/main.vue
index f83e2bd50a0b3..656de16594570 100644
--- a/packages/components/carousel/src/main.vue
+++ b/packages/components/carousel/src/main.vue
@@ -76,12 +76,12 @@ import {
   removeResizeListener,
 } from '@element-plus/utils/resize-event'
 
+import { debugWarn } from '@element-plus/utils/error'
 import type {
   ICarouselProps,
   CarouselItem,
   InjectCarouselScope,
 } from './carousel'
-import { debugWarn } from '@element-plus/utils/error'
 
 export default defineComponent({
   name: 'ElCarousel',
diff --git a/packages/components/cascader-panel/index.ts b/packages/components/cascader-panel/index.ts
index 4bcea439f569b..c5da8c531d654 100644
--- a/packages/components/cascader-panel/index.ts
+++ b/packages/components/cascader-panel/index.ts
@@ -1,6 +1,6 @@
-import { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils/types'
 import CascaderPanel from './src/index.vue'
+import type { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 
 CascaderPanel.install = (app: App): void => {
   app.component(CascaderPanel.name, CascaderPanel)
diff --git a/packages/components/cascader-panel/src/index.vue b/packages/components/cascader-panel/src/index.vue
index 0118c6a90d786..eb9783890ab6e 100644
--- a/packages/components/cascader-panel/src/index.vue
+++ b/packages/components/cascader-panel/src/index.vue
@@ -22,7 +22,6 @@ import {
   onMounted,
   provide,
   reactive,
-  Ref,
   ref,
   watch,
 } from 'vue'
@@ -40,7 +39,7 @@ import {
 
 import ElCascaderMenu from './menu.vue'
 import Store from './store'
-import Node from './node'
+import Node, { ExpandTrigger } from './node'
 import { CommonProps, useCascaderConfig } from './config'
 import {
   checkNode,
@@ -49,19 +48,19 @@ import {
   getSibling,
   sortByOriginalOrder,
 } from './utils'
-import { default as CascaderNode, ExpandTrigger } from './node'
 import { CASCADER_PANEL_INJECTION_KEY } from './types'
 
-import type { PropType } from 'vue'
+import type { PropType, Ref } from 'vue'
 import type { Nullable } from '@element-plus/utils/types'
 import type {
   CascaderValue,
   CascaderNodeValue,
   CascaderOption,
   RenderLabel,
+  default as CascaderNode,
 } from './node'
 
-import { ElCascaderPanelContext } from './types'
+import type { ElCascaderPanelContext } from './types'
 
 export default defineComponent({
   name: 'ElCascaderPanel',
@@ -293,24 +292,27 @@ export default defineComponent({
 
       switch (code) {
         case EVENT_CODE.up:
-        case EVENT_CODE.down:
+        case EVENT_CODE.down: {
           const distance = code === EVENT_CODE.up ? -1 : 1
           focusNode(getSibling(target, distance))
           break
-        case EVENT_CODE.left:
+        }
+        case EVENT_CODE.left: {
           const preMenu = menuList.value[getMenuIndex(target) - 1]
           const expandedNode = preMenu?.$el.querySelector(
             '.el-cascader-node[aria-expanded="true"]'
           )
           focusNode(expandedNode)
           break
-        case EVENT_CODE.right:
+        }
+        case EVENT_CODE.right: {
           const nextMenu = menuList.value[getMenuIndex(target) + 1]
           const firstNode = nextMenu?.$el.querySelector(
             '.el-cascader-node[tabindex="-1"]'
           )
           focusNode(firstNode)
           break
+        }
         case EVENT_CODE.enter:
           checkNode(target)
           break
diff --git a/packages/components/cascader-panel/src/menu.vue b/packages/components/cascader-panel/src/menu.vue
index 9422b2513dffa..d32c30bcb2a04 100644
--- a/packages/components/cascader-panel/src/menu.vue
+++ b/packages/components/cascader-panel/src/menu.vue
@@ -33,8 +33,8 @@ import ElScrollbar from '@element-plus/components/scrollbar'
 import { useLocaleInject } from '@element-plus/hooks'
 import { generateId } from '@element-plus/utils/util'
 import ElCascaderNode from './node.vue'
-import { default as CascaderNode } from './node'
 import { CASCADER_PANEL_INJECTION_KEY } from './types'
+import type { default as CascaderNode } from './node'
 
 import type { PropType } from 'vue'
 import type { TimeoutHandle, Nullable } from '@element-plus/utils/types'
diff --git a/packages/components/cascader-panel/src/node.vue b/packages/components/cascader-panel/src/node.vue
index 7498f9f53804d..cca6ecef80f35 100644
--- a/packages/components/cascader-panel/src/node.vue
+++ b/packages/components/cascader-panel/src/node.vue
@@ -65,8 +65,8 @@ import { computed, defineComponent, inject } from 'vue'
 import ElCheckbox from '@element-plus/components/checkbox'
 import ElRadio from '@element-plus/components/radio'
 import NodeContent from './node-content'
-import type { default as CascaderNode } from './node'
 import { CASCADER_PANEL_INJECTION_KEY } from './types'
+import type { default as CascaderNode } from './node'
 
 import type { PropType } from 'vue'
 
diff --git a/packages/components/cascader/index.ts b/packages/components/cascader/index.ts
index 1340d0aea7529..15519a2a08389 100644
--- a/packages/components/cascader/index.ts
+++ b/packages/components/cascader/index.ts
@@ -1,6 +1,6 @@
-import { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils/types'
 import Cascader from './src/index.vue'
+import type { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 
 Cascader.install = (app: App): void => {
   app.component(Cascader.name, Cascader)
diff --git a/packages/components/cascader/src/index.vue b/packages/components/cascader/src/index.vue
index 7369cf9b4ad42..efafe81c618ce 100644
--- a/packages/components/cascader/src/index.vue
+++ b/packages/components/cascader/src/index.vue
@@ -141,7 +141,6 @@ import {
   nextTick,
   onMounted,
   onBeforeUnmount,
-  Ref,
   ref,
   watch,
 } from 'vue'
@@ -152,7 +151,7 @@ import ElCascaderPanel, {
   CommonProps,
 } from '@element-plus/components/cascader-panel'
 import ElInput from '@element-plus/components/input'
-import ElPopper from '@element-plus/components/popper'
+import ElPopper, { Effect } from '@element-plus/components/popper'
 import ElScrollbar from '@element-plus/components/scrollbar'
 import ElTag from '@element-plus/components/tag'
 import { elFormKey, elFormItemKey } from '@element-plus/tokens'
@@ -169,9 +168,9 @@ import {
   removeResizeListener,
 } from '@element-plus/utils/resize-event'
 import { isValidComponentSize } from '@element-plus/utils/validators'
-import { Effect, Options } from '@element-plus/components/popper'
+import type { Options } from '@element-plus/components/popper'
 
-import type { ComputedRef, PropType } from 'vue'
+import type { ComputedRef, PropType, Ref } from 'vue'
 import type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'
 import type {
   CascaderValue,
diff --git a/packages/components/check-tag/index.ts b/packages/components/check-tag/index.ts
index a5d6b9cfb25dc..2c25ca00b25d3 100644
--- a/packages/components/check-tag/index.ts
+++ b/packages/components/check-tag/index.ts
@@ -1,5 +1,5 @@
-import CheckTag from './src/index.vue'
 import { withInstall } from '@element-plus/utils/with-install'
+import CheckTag from './src/index.vue'
 
 export const ElCheckTag = withInstall(CheckTag)
 export default ElCheckTag
diff --git a/packages/components/checkbox/__tests__/checkbox.spec.ts b/packages/components/checkbox/__tests__/checkbox.spec.ts
index 4a1aadea7c6d4..41a7a7ac3000f 100644
--- a/packages/components/checkbox/__tests__/checkbox.spec.ts
+++ b/packages/components/checkbox/__tests__/checkbox.spec.ts
@@ -1,5 +1,5 @@
-import { mount } from '@vue/test-utils'
 import { nextTick } from 'vue'
+import { mount } from '@vue/test-utils'
 import Checkbox from '../src/checkbox.vue'
 import CheckboxButton from '../src/checkbox-button.vue'
 import CheckboxGroup from '../src/checkbox-group.vue'
diff --git a/packages/components/checkbox/src/checkbox.type.ts b/packages/components/checkbox/src/checkbox.type.ts
index f9d5e441f515f..29ba28baf079a 100644
--- a/packages/components/checkbox/src/checkbox.type.ts
+++ b/packages/components/checkbox/src/checkbox.type.ts
@@ -1,5 +1,5 @@
-import { ComputedRef } from 'vue'
-import { AnyFunction } from '@element-plus/utils/types'
+import type { ComputedRef } from 'vue'
+import type { AnyFunction } from '@element-plus/utils/types'
 export interface ICheckboxGroupInstance {
   name?: string
   modelValue?: ComputedRef
diff --git a/packages/components/collapse/__tests__/collapse.spec.ts b/packages/components/collapse/__tests__/collapse.spec.ts
index 887e9ce48937c..a507e829e89c7 100644
--- a/packages/components/collapse/__tests__/collapse.spec.ts
+++ b/packages/components/collapse/__tests__/collapse.spec.ts
@@ -1,5 +1,5 @@
-import { mount } from '@vue/test-utils'
 import { nextTick } from 'vue'
+import { mount } from '@vue/test-utils'
 import Collapse from '../src/collapse.vue'
 import CollapseItem from '../src/collapse-item.vue'
 
diff --git a/packages/components/collapse/index.ts b/packages/components/collapse/index.ts
index 70e42f628709b..5a83931b2e733 100644
--- a/packages/components/collapse/index.ts
+++ b/packages/components/collapse/index.ts
@@ -1,7 +1,7 @@
-import { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils/types'
 import Collapse from './src/collapse.vue'
 import CollapseItem from './src/collapse-item.vue'
+import type { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 
 Collapse.install = (app: App): void => {
   app.component(Collapse.name, Collapse)
diff --git a/packages/components/collapse/src/collapse-item.vue b/packages/components/collapse/src/collapse-item.vue
index d902bae611111..a8abcc9772f74 100644
--- a/packages/components/collapse/src/collapse-item.vue
+++ b/packages/components/collapse/src/collapse-item.vue
@@ -48,9 +48,10 @@
   </div>
 </template>
 <script lang="ts">
-import { defineComponent, PropType, inject, computed, ref } from 'vue'
+import { defineComponent, inject, computed, ref } from 'vue'
 import { generateId } from '@element-plus/utils/util'
 import ElCollapseTransition from '@element-plus/components/collapse-transition'
+import type { PropType } from 'vue'
 
 import type { CollapseProvider } from './collapse.type'
 
diff --git a/packages/components/collapse/src/collapse.type.ts b/packages/components/collapse/src/collapse.type.ts
index 5e66a9c5f4ff8..7312a72309fd9 100644
--- a/packages/components/collapse/src/collapse.type.ts
+++ b/packages/components/collapse/src/collapse.type.ts
@@ -1,4 +1,4 @@
-import { Ref } from 'vue'
+import type { Ref } from 'vue'
 
 export interface CollapseProvider {
   activeNames: Ref
diff --git a/packages/components/collapse/src/collapse.vue b/packages/components/collapse/src/collapse.vue
index ba1458a6558d6..0d9150e2764a1 100644
--- a/packages/components/collapse/src/collapse.vue
+++ b/packages/components/collapse/src/collapse.vue
@@ -6,9 +6,9 @@
 
 <script lang="ts">
 import { defineComponent, ref, watch, provide } from 'vue'
+import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'
 import type { PropType } from 'vue'
 import type { CollapseProvider } from './collapse.type'
-import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'
 
 export default defineComponent({
   name: 'ElCollapse',
diff --git a/packages/components/color-picker/__tests__/color-picker.spec.ts b/packages/components/color-picker/__tests__/color-picker.spec.ts
index afde655e9ac32..f0a992b19187a 100644
--- a/packages/components/color-picker/__tests__/color-picker.spec.ts
+++ b/packages/components/color-picker/__tests__/color-picker.spec.ts
@@ -1,6 +1,7 @@
+import { defineComponent, nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
-import { ComponentPublicInstance, defineComponent, nextTick } from 'vue'
 import ColorPicker from '../src/index.vue'
+import type { ComponentPublicInstance } from 'vue'
 
 import type { Nullable } from '@element-plus/utils/types'
 
diff --git a/packages/components/date-picker/__tests__/date-picker.spec.ts b/packages/components/date-picker/__tests__/date-picker.spec.ts
index 7577c558ce82f..08823e6cbab44 100644
--- a/packages/components/date-picker/__tests__/date-picker.spec.ts
+++ b/packages/components/date-picker/__tests__/date-picker.spec.ts
@@ -1,12 +1,12 @@
+import { nextTick } from 'vue'
+import { mount } from '@vue/test-utils'
+import dayjs from 'dayjs'
 import ConfigProvider from '@element-plus/components/config-provider'
 import { CommonPicker } from '@element-plus/components/time-picker'
 import Input from '@element-plus/components/input'
-import { mount } from '@vue/test-utils'
 import zhCn from '@element-plus/locale/lang/zh-cn'
 import enUs from '@element-plus/locale/lang/en'
-import dayjs from 'dayjs'
 import 'dayjs/locale/zh-cn'
-import { nextTick } from 'vue'
 import DatePicker from '../src/date-picker'
 
 const _mount = (template: string, data = () => ({}), otherObj?) =>
diff --git a/packages/components/date-picker/__tests__/date-time-picker.spec.ts b/packages/components/date-picker/__tests__/date-time-picker.spec.ts
index 4d62041bdd95b..ca7fb19017e38 100644
--- a/packages/components/date-picker/__tests__/date-time-picker.spec.ts
+++ b/packages/components/date-picker/__tests__/date-time-picker.spec.ts
@@ -1,7 +1,7 @@
+import { nextTick } from 'vue'
+import { mount } from '@vue/test-utils'
 import dayjs from 'dayjs'
 import { triggerEvent } from '@element-plus/test-utils'
-import { mount } from '@vue/test-utils'
-import { nextTick } from 'vue'
 import DatePicker from '../src/date-picker'
 
 const formatStr = 'YYYY-MM-DD HH:mm:ss'
diff --git a/packages/components/date-picker/src/date-picker-com/basic-date-table.vue b/packages/components/date-picker/src/date-picker-com/basic-date-table.vue
index 98bed48126aef..ff35c9d25ddeb 100644
--- a/packages/components/date-picker/src/date-picker-com/basic-date-table.vue
+++ b/packages/components/date-picker/src/date-picker-com/basic-date-table.vue
@@ -41,8 +41,8 @@ import { defineComponent, computed, ref } from 'vue'
 import dayjs from 'dayjs'
 import { useLocaleInject } from '@element-plus/hooks'
 import { coerceTruthyValueToArray } from '@element-plus/utils/util'
+import type { PropType } from 'vue'
 
-import { PropType } from 'vue'
 import type { Dayjs } from 'dayjs'
 
 export default defineComponent({
diff --git a/packages/components/descriptions/__tests__/descriptions.spec.ts b/packages/components/descriptions/__tests__/descriptions.spec.ts
index ae03162956d25..f8d8c2184a775 100644
--- a/packages/components/descriptions/__tests__/descriptions.spec.ts
+++ b/packages/components/descriptions/__tests__/descriptions.spec.ts
@@ -1,7 +1,7 @@
+import { nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
 import Descriptions from '../src/index.vue'
 import DescriptionsItem from '../src/description-item'
-import { nextTick } from 'vue'
 
 const _mount = (template: string, data?: () => void, methods?: any) =>
   mount({
diff --git a/packages/components/descriptions/src/token.ts b/packages/components/descriptions/src/token.ts
index 5d8cefdd5abcd..0789daf4848c5 100644
--- a/packages/components/descriptions/src/token.ts
+++ b/packages/components/descriptions/src/token.ts
@@ -1,5 +1,5 @@
-import { InjectionKey } from 'vue'
-import { IDescriptionsInject } from './descriptions.type'
+import type { InjectionKey } from 'vue'
+import type { IDescriptionsInject } from './descriptions.type'
 
 export const elDescriptionsKey =
   'elDescriptions' as any as InjectionKey<IDescriptionsInject>
diff --git a/packages/components/dropdown/src/dropdown.vue b/packages/components/dropdown/src/dropdown.vue
index 59d4b400afadb..e87a5d8339045 100644
--- a/packages/components/dropdown/src/dropdown.vue
+++ b/packages/components/dropdown/src/dropdown.vue
@@ -64,15 +64,15 @@ import {
   watch,
   onMounted,
 } from 'vue'
-import type { PropType } from 'vue'
 import ElButton from '@element-plus/components/button'
-import ElPopper, { Effect, Placement } from '@element-plus/components/popper'
+import ElPopper, { Effect } from '@element-plus/components/popper'
 import ElScrollbar from '@element-plus/components/scrollbar'
 import { on, addClass, removeClass } from '@element-plus/utils/dom'
 import { addUnit } from '@element-plus/utils/util'
 import { useDropdown } from './useDropdown'
+import type { Placement } from '@element-plus/components/popper'
+import type { PropType, ComponentPublicInstance } from 'vue'
 
-import type { ComponentPublicInstance } from 'vue'
 import type { TriggerType } from '@element-plus/hooks/use-popper/use-target-events'
 import type { ButtonType } from '@element-plus/components/button/src/types'
 
diff --git a/packages/components/form/__tests__/form.spec.ts b/packages/components/form/__tests__/form.spec.ts
index 1978618c333cb..4868b4c353f1e 100644
--- a/packages/components/form/__tests__/form.spec.ts
+++ b/packages/components/form/__tests__/form.spec.ts
@@ -1,11 +1,12 @@
 import { nextTick } from 'vue'
-import { mount, VueWrapper } from '@vue/test-utils'
+import { mount } from '@vue/test-utils'
 import installStyle from '@element-plus/test-utils/style-plugin'
 import Checkbox from '@element-plus/components/checkbox/src/checkbox.vue'
 import CheckboxGroup from '@element-plus/components/checkbox/src/checkbox-group.vue'
 import Input from '@element-plus/components/input/src/index.vue'
 import Form from '../src/form.vue'
 import FormItem from '../src/form-item.vue'
+import type { VueWrapper } from '@vue/test-utils'
 
 type Methods = Record<string, () => any>
 function mountForm<D, M extends Methods, C>(
diff --git a/packages/components/form/src/form-item.vue b/packages/components/form/src/form-item.vue
index cd8b0904eca45..4f33435016397 100644
--- a/packages/components/form/src/form-item.vue
+++ b/packages/components/form/src/form-item.vue
@@ -50,16 +50,16 @@ import {
   toRefs,
   watch,
 } from 'vue'
-import AsyncValidator from 'async-validator'
 import { NOOP } from '@vue/shared'
+import AsyncValidator from 'async-validator'
 import {
   addUnit,
   getPropByPath,
   useGlobalConfig,
 } from '@element-plus/utils/util'
 import { isValidComponentSize } from '@element-plus/utils/validators'
-import LabelWrap from './label-wrap'
 import { elFormItemKey, elFormKey } from '@element-plus/tokens'
+import LabelWrap from './label-wrap'
 
 import type { PropType, CSSProperties } from 'vue'
 import type { ComponentSize } from '@element-plus/utils/types'
diff --git a/packages/components/form/src/form.type.ts b/packages/components/form/src/form.type.ts
index 36bdbb405f719..ab3811a32a7f5 100644
--- a/packages/components/form/src/form.type.ts
+++ b/packages/components/form/src/form.type.ts
@@ -1,4 +1,4 @@
-import { RuleItem } from 'async-validator'
+import type { RuleItem } from 'async-validator'
 
 export declare interface FormItemRule extends RuleItem {
   trigger?: string
diff --git a/packages/components/form/src/form.vue b/packages/components/form/src/form.vue
index 278d096597d76..6326668f2d2a2 100644
--- a/packages/components/form/src/form.vue
+++ b/packages/components/form/src/form.vue
@@ -20,8 +20,9 @@ import {
   toRefs,
   watch,
 } from 'vue'
-import { FieldErrorList } from 'async-validator'
 import { elFormKey } from '@element-plus/tokens'
+import { debugWarn } from '@element-plus/utils/error'
+import type { FieldErrorList } from 'async-validator'
 
 import type { PropType } from 'vue'
 import type { ComponentSize } from '@element-plus/utils/types'
diff --git a/packages/components/form/src/label-wrap.ts b/packages/components/form/src/label-wrap.ts
index 90d1add962217..ef5385f3c0677 100644
--- a/packages/components/form/src/label-wrap.ts
+++ b/packages/components/form/src/label-wrap.ts
@@ -13,9 +13,9 @@ import {
 import {
   addResizeListener,
   removeResizeListener,
-  ResizableElement,
 } from '@element-plus/utils/resize-event'
 import { elFormItemKey, elFormKey } from '@element-plus/tokens'
+import type { ResizableElement } from '@element-plus/utils/resize-event'
 
 import type { CSSProperties } from 'vue'
 import type { Nullable } from '@element-plus/utils/types'
diff --git a/packages/components/image-viewer/__tests__/image-viewer.spec.ts b/packages/components/image-viewer/__tests__/image-viewer.spec.ts
index 119c0f8e77fb9..9b979c5d8e851 100644
--- a/packages/components/image-viewer/__tests__/image-viewer.spec.ts
+++ b/packages/components/image-viewer/__tests__/image-viewer.spec.ts
@@ -1,8 +1,8 @@
-import ImageViewer from '../src/index.vue'
 import { nextTick } from 'vue'
 
 import { IMAGE_SUCCESS } from '@element-plus/test-utils/mock'
 import makeMount from '@element-plus/test-utils/make-mount'
+import ImageViewer from '../src/index.vue'
 
 const mount = makeMount(ImageViewer, {
   props: {
diff --git a/packages/components/image/__tests__/image.spec.ts b/packages/components/image/__tests__/image.spec.ts
index 58d9d64b14b65..946152beeac11 100644
--- a/packages/components/image/__tests__/image.spec.ts
+++ b/packages/components/image/__tests__/image.spec.ts
@@ -1,12 +1,11 @@
-import { mount } from '@vue/test-utils'
-import Image from '../src/index.vue'
 import { nextTick } from 'vue'
-
+import { mount } from '@vue/test-utils'
 import {
   IMAGE_SUCCESS,
   IMAGE_FAIL,
   mockImageEvent,
 } from '@element-plus/test-utils/mock'
+import Image from '../src/index.vue'
 
 // firstly wait for image event
 // secondly wait for vue render
diff --git a/packages/components/infinite-scroll/__tests__/infinite-scroll.spec.ts b/packages/components/infinite-scroll/__tests__/infinite-scroll.spec.ts
index 648f49e73a1c6..c9a62c33cd46b 100644
--- a/packages/components/infinite-scroll/__tests__/infinite-scroll.spec.ts
+++ b/packages/components/infinite-scroll/__tests__/infinite-scroll.spec.ts
@@ -1,5 +1,5 @@
-import { mount } from '@vue/test-utils'
 import { ref, nextTick } from 'vue'
+import { mount } from '@vue/test-utils'
 import { tick, defineGetter, makeScroll } from '@element-plus/test-utils'
 import InfiniteScroll, { SCOPE, DEFAULT_DELAY } from '../src/index'
 
diff --git a/packages/components/infinite-scroll/src/index.ts b/packages/components/infinite-scroll/src/index.ts
index 4c1ccf782fcc3..58daddd5e83b5 100644
--- a/packages/components/infinite-scroll/src/index.ts
+++ b/packages/components/infinite-scroll/src/index.ts
@@ -1,6 +1,6 @@
 import { nextTick } from 'vue'
-import throttle from 'lodash/throttle'
 import { isFunction } from '@vue/shared'
+import throttle from 'lodash/throttle'
 import {
   getScrollContainer,
   getOffsetTopDistance,
diff --git a/packages/components/input-number/__tests__/input-number.spec.ts b/packages/components/input-number/__tests__/input-number.spec.ts
index 7a578c19097a7..9f5f6e1b6f64b 100644
--- a/packages/components/input-number/__tests__/input-number.spec.ts
+++ b/packages/components/input-number/__tests__/input-number.spec.ts
@@ -1,6 +1,6 @@
+import { ref, nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
 import InputNumber from '../src/index.vue'
-import { ref, nextTick } from 'vue'
 
 const mouseup = new Event('mouseup')
 const _mount = (options) =>
diff --git a/packages/components/link/src/index.vue b/packages/components/link/src/index.vue
index 851ad88ff0e2e..28818fd75727f 100644
--- a/packages/components/link/src/index.vue
+++ b/packages/components/link/src/index.vue
@@ -19,7 +19,8 @@
   </a>
 </template>
 <script lang="ts">
-import { defineComponent, PropType } from 'vue'
+import { defineComponent } from 'vue'
+import type { PropType } from 'vue'
 
 type ILinkType = PropType<
   'primary' | 'success' | 'warning' | 'info' | 'danger' | 'default'
diff --git a/packages/components/loading/__tests__/loading.spec.ts b/packages/components/loading/__tests__/loading.spec.ts
index 543ec3e157272..7740b88dcf201 100644
--- a/packages/components/loading/__tests__/loading.spec.ts
+++ b/packages/components/loading/__tests__/loading.spec.ts
@@ -1,9 +1,9 @@
+import { nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
 import { sleep } from '@element-plus/test-utils'
 import Loading from '../src/index'
 import ElInput from '../../input'
 import vLoading from '../src/directive'
-import { nextTick } from 'vue'
 
 function destroyLoadingInstance(loadingInstance) {
   if (!loadingInstance) return
diff --git a/packages/components/loading/src/directive.ts b/packages/components/loading/src/directive.ts
index cfd5e5f9afeb9..aa03454af04fc 100644
--- a/packages/components/loading/src/directive.ts
+++ b/packages/components/loading/src/directive.ts
@@ -25,7 +25,7 @@ const createInstance = (el: ElementLoading, binding: DirectiveBinding) => {
     background: (vm && vm[backgroundExr]) || backgroundExr,
     customClass: (vm && vm[customClassExr]) || customClassExr,
     fullscreen: !!binding.modifiers.fullscreen,
-    target: !!binding.modifiers.fullscreen ? null : el,
+    target: binding.modifiers.fullscreen ? null : el,
     body: !!binding.modifiers.body,
     visible: true,
     lock: !!binding.modifiers.lock,
@@ -34,7 +34,7 @@ const createInstance = (el: ElementLoading, binding: DirectiveBinding) => {
 
 const vLoading = {
   mounted(el: ElementLoading, binding: DirectiveBinding) {
-    if (!!binding.value) {
+    if (binding.value) {
       createInstance(el, binding)
     }
   },
diff --git a/packages/components/menu/__tests__/menu.spec.ts b/packages/components/menu/__tests__/menu.spec.ts
index fb0ea88005600..9d658a05b3edb 100644
--- a/packages/components/menu/__tests__/menu.spec.ts
+++ b/packages/components/menu/__tests__/menu.spec.ts
@@ -1,5 +1,5 @@
-import { mount } from '@vue/test-utils'
 import { nextTick } from 'vue'
+import { mount } from '@vue/test-utils'
 import { sleep } from '@element-plus/test-utils'
 import { rAF } from '@element-plus/test-utils/tick'
 
diff --git a/packages/components/menu/src/menu.ts b/packages/components/menu/src/menu.ts
index 0489c67a0460a..a68e1c0f7f1f9 100644
--- a/packages/components/menu/src/menu.ts
+++ b/packages/components/menu/src/menu.ts
@@ -5,9 +5,7 @@ import {
   computed,
   ref,
   provide,
-  Ref,
   onMounted,
-  ComputedRef,
   isRef,
   h,
   withDirectives,
@@ -19,7 +17,7 @@ import ElMenuCollapseTransition from './menu-collapse-transition.vue'
 import ElSubMenu from './submenu.vue'
 import useMenuColor from './useMenuColor'
 
-import type { VNode } from 'vue'
+import type { VNode, Ref, ComputedRef } from 'vue'
 import type {
   IMenuProps,
   RootMenuProvider,
diff --git a/packages/components/menu/src/useMenu.ts b/packages/components/menu/src/useMenu.ts
index 49bbc2cefc949..50c8efb0178d3 100644
--- a/packages/components/menu/src/useMenu.ts
+++ b/packages/components/menu/src/useMenu.ts
@@ -1,6 +1,6 @@
-import { computed, ComputedRef, inject } from 'vue'
+import { computed, inject } from 'vue'
 
-import type { ComponentInternalInstance } from 'vue'
+import type { ComponentInternalInstance, ComputedRef } from 'vue'
 import type { RootMenuProvider } from './menu.type'
 
 export default function useMenu(
diff --git a/packages/components/message-box/__tests__/message-box.spec.ts b/packages/components/message-box/__tests__/message-box.spec.ts
index 01c2dfeaa792a..ebe8b7350514a 100644
--- a/packages/components/message-box/__tests__/message-box.spec.ts
+++ b/packages/components/message-box/__tests__/message-box.spec.ts
@@ -1,7 +1,7 @@
 import { mount } from '@vue/test-utils'
-import MessageBox from '../src/messageBox'
 import { rAF } from '@element-plus/test-utils/tick'
 import { triggerNativeCompositeClick } from '@element-plus/test-utils/composite-click'
+import MessageBox from '../src/messageBox'
 
 const selector = '.el-overlay'
 
diff --git a/packages/components/notification/__tests__/notification.spec.ts b/packages/components/notification/__tests__/notification.spec.ts
index b85a2323ba2f9..8343028cf0331 100644
--- a/packages/components/notification/__tests__/notification.spec.ts
+++ b/packages/components/notification/__tests__/notification.spec.ts
@@ -1,10 +1,11 @@
-import { h, ComponentPublicInstance, nextTick } from 'vue'
+import { h, nextTick } from 'vue'
 import { rAF } from '@element-plus/test-utils/tick'
 import makeMount from '@element-plus/test-utils/make-mount'
 import * as domExports from '@element-plus/utils/dom'
 import { EVENT_CODE } from '@element-plus/utils/aria'
 import PopupManager from '@element-plus/utils/popup-manager'
 import Notification from '../src/index.vue'
+import type { ComponentPublicInstance } from 'vue'
 
 import type { VueWrapper } from '@vue/test-utils'
 
diff --git a/packages/components/pagination/__tests__/pagination.spec.ts b/packages/components/pagination/__tests__/pagination.spec.ts
index 22b97389bb56f..d90c0e8b14021 100644
--- a/packages/components/pagination/__tests__/pagination.spec.ts
+++ b/packages/components/pagination/__tests__/pagination.spec.ts
@@ -1,6 +1,7 @@
 import { nextTick, ref, h } from 'vue'
-import { mount, VueWrapper } from '@vue/test-utils'
+import { mount } from '@vue/test-utils'
 import Pagination from '../src/index'
+import type { VueWrapper } from '@vue/test-utils'
 
 const assertElementsExistence = (
   wrapper: VueWrapper<any>,
diff --git a/packages/components/popover/src/index.vue b/packages/components/popover/src/index.vue
index 5710634475e86..18304f126bd5a 100644
--- a/packages/components/popover/src/index.vue
+++ b/packages/components/popover/src/index.vue
@@ -11,8 +11,7 @@ import {
   h,
 } from 'vue'
 import { ClickOutside } from '@element-plus/directives'
-import ElPopper from '@element-plus/components/popper'
-import {
+import ElPopper, {
   popperDefaultProps,
   Effect,
   renderArrow,
diff --git a/packages/components/popper/__tests__/popper.spec.ts b/packages/components/popper/__tests__/popper.spec.ts
index f08161321d5be..95cbd035c445d 100644
--- a/packages/components/popper/__tests__/popper.spec.ts
+++ b/packages/components/popper/__tests__/popper.spec.ts
@@ -1,11 +1,11 @@
-import { mount } from '@vue/test-utils'
 import * as Vue from 'vue'
+import { mount } from '@vue/test-utils'
 import * as popperExports from '@popperjs/core'
 import { rAF } from '@element-plus/test-utils/tick'
+import PopupManager from '@element-plus/utils/popup-manager'
 import ElPopper from '../src/index.vue'
 
 import type { VueWrapper } from '@vue/test-utils'
-import PopupManager from '@element-plus/utils/popup-manager'
 
 type UnknownProps = Record<string, unknown>
 
diff --git a/packages/components/select-v2/src/token.ts b/packages/components/select-v2/src/token.ts
index a127e46213448..ce59a352e7bd5 100644
--- a/packages/components/select-v2/src/token.ts
+++ b/packages/components/select-v2/src/token.ts
@@ -1,5 +1,5 @@
+import type { OptionProps, SelectProps } from './defaults'
 import type { ExtractPropTypes, InjectionKey } from 'vue'
-import { OptionProps, SelectProps } from './defaults'
 import type { Option } from './select.types'
 
 export interface SelectV2Context {
diff --git a/packages/components/select-v2/src/useInput.ts b/packages/components/select-v2/src/useInput.ts
index 200092ecf4346..e5e84b96531ba 100644
--- a/packages/components/select-v2/src/useInput.ts
+++ b/packages/components/select-v2/src/useInput.ts
@@ -1,6 +1,6 @@
 import { ref } from 'vue'
-import { isKorean } from '@element-plus/utils/isDef'
 import { isFunction } from '@vue/shared'
+import { isKorean } from '@element-plus/utils/isDef'
 
 export function useInput(handleInput: (event: InputEvent) => void) {
   const isComposing = ref(false)
diff --git a/packages/components/select-v2/src/useSelect.ts b/packages/components/select-v2/src/useSelect.ts
index 014915f6b6751..20ddf4ad5a06a 100644
--- a/packages/components/select-v2/src/useSelect.ts
+++ b/packages/components/select-v2/src/useSelect.ts
@@ -23,13 +23,13 @@ import { Effect } from '@element-plus/components/popper'
 
 import { useAllowCreate } from './useAllowCreate'
 
-import { SelectProps } from './defaults'
 import { flattenOptions } from './util'
 
+import { useInput } from './useInput'
+import type { SelectProps } from './defaults'
 import type { ExtractPropTypes, CSSProperties } from 'vue'
 import type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'
 import type { OptionType, Option } from './select.types'
-import { useInput } from './useInput'
 
 const DEFAULT_INPUT_PLACEHOLDER = ''
 const MINIMUM_INPUT_WIDTH = 11
diff --git a/packages/components/select/src/option.vue b/packages/components/select/src/option.vue
index 629e5ec42e3b7..0e41dad86c22d 100644
--- a/packages/components/select/src/option.vue
+++ b/packages/components/select/src/option.vue
@@ -25,7 +25,7 @@ import {
   reactive,
 } from 'vue'
 import { useOption } from './useOption'
-import { SelectOptionProxy } from './token'
+import type { SelectOptionProxy } from './token'
 
 export default defineComponent({
   name: 'ElOption',
diff --git a/packages/components/select/src/select-dropdown.vue b/packages/components/select/src/select-dropdown.vue
index 523744fc2af75..7a36be8d3e184 100644
--- a/packages/components/select/src/select-dropdown.vue
+++ b/packages/components/select/src/select-dropdown.vue
@@ -20,9 +20,9 @@ import {
 import {
   addResizeListener,
   removeResizeListener,
-  ResizableElement,
 } from '@element-plus/utils/resize-event'
 import { selectKey } from './token'
+import type { ResizableElement } from '@element-plus/utils/resize-event'
 
 export default defineComponent({
   name: 'ElSelectDropdown',
diff --git a/packages/components/select/src/useSelect.ts b/packages/components/select/src/useSelect.ts
index c0350f04e7e45..1df1daeb58d4a 100644
--- a/packages/components/select/src/useSelect.ts
+++ b/packages/components/select/src/useSelect.ts
@@ -8,21 +8,20 @@ import {
   shallowRef,
   triggerRef,
 } from 'vue'
+import { isObject, toRawType } from '@vue/shared'
+import lodashDebounce from 'lodash/debounce'
+import isEqual from 'lodash/isEqual'
 import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'
 import { EVENT_CODE } from '@element-plus/utils/aria'
 import { useLocaleInject } from '@element-plus/hooks'
 import isServer from '@element-plus/utils/isServer'
 import scrollIntoView from '@element-plus/utils/scroll-into-view'
-import lodashDebounce from 'lodash/debounce'
 import { isKorean } from '@element-plus/utils/isDef'
 import { getValueByPath, useGlobalConfig } from '@element-plus/utils/util'
 import { elFormKey, elFormItemKey } from '@element-plus/tokens'
-import { QueryChangeCtx } from './token'
-import isEqual from 'lodash/isEqual'
-import { isObject, toRawType } from '@vue/shared'
+import type { QueryChangeCtx, SelectOptionProxy } from './token'
 
 import type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'
-import { SelectOptionProxy } from './token'
 
 export function useSelectStates(props) {
   const { t } = useLocaleInject()
diff --git a/packages/components/slider/src/index.vue b/packages/components/slider/src/index.vue
index e6068fb0cb49b..26511d672bbe4 100644
--- a/packages/components/slider/src/index.vue
+++ b/packages/components/slider/src/index.vue
@@ -84,7 +84,6 @@ import {
   provide,
   reactive,
   ref,
-  Ref,
   toRefs,
   watch,
 } from 'vue'
@@ -102,7 +101,7 @@ import { useMarks } from './useMarks'
 import { useSlide } from './useSlide'
 import { useStops } from './useStops'
 
-import type { PropType } from 'vue'
+import type { PropType, Ref } from 'vue'
 import type { ComponentSize, Nullable } from '@element-plus/utils/types'
 
 export default defineComponent({
diff --git a/packages/components/slider/src/useSlide.ts b/packages/components/slider/src/useSlide.ts
index 79089d39e3100..3b47ec43e26fc 100644
--- a/packages/components/slider/src/useSlide.ts
+++ b/packages/components/slider/src/useSlide.ts
@@ -1,6 +1,7 @@
-import { computed, CSSProperties, inject, nextTick, ref, shallowRef } from 'vue'
+import { computed, inject, nextTick, ref, shallowRef } from 'vue'
 import { CHANGE_EVENT } from '@element-plus/utils/constants'
 import { elFormKey, elFormItemKey } from '@element-plus/tokens'
+import type { CSSProperties } from 'vue'
 import type { ButtonRefs, ISliderInitData, ISliderProps } from './slider.type'
 
 import type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'
diff --git a/packages/components/slider/src/useSliderButton.ts b/packages/components/slider/src/useSliderButton.ts
index 980ab6f4125c6..0a0d084d27f90 100644
--- a/packages/components/slider/src/useSliderButton.ts
+++ b/packages/components/slider/src/useSliderButton.ts
@@ -1,9 +1,9 @@
-import { computed, CSSProperties, inject, nextTick, ref, watch } from 'vue'
+import { computed, inject, nextTick, ref, watch } from 'vue'
 import debounce from 'lodash/debounce'
 import { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'
 import { off, on } from '@element-plus/utils/dom'
 
-import type { ComputedRef } from 'vue'
+import type { ComputedRef, CSSProperties } from 'vue'
 import type {
   ISliderButtonInitData,
   ISliderButtonProps,
diff --git a/packages/components/slider/src/useStops.ts b/packages/components/slider/src/useStops.ts
index 9ac431c34340c..b66946abb816c 100644
--- a/packages/components/slider/src/useStops.ts
+++ b/packages/components/slider/src/useStops.ts
@@ -1,5 +1,6 @@
+import { computed } from 'vue'
 import { debugWarn } from '@element-plus/utils/error'
-import { computed, ComputedRef, CSSProperties } from 'vue'
+import type { ComputedRef, CSSProperties } from 'vue'
 import type { ISliderInitData, ISliderProps, Stops } from './slider.type'
 
 export const useStops = (
diff --git a/packages/components/table/__tests__/table.spec.ts b/packages/components/table/__tests__/table.spec.ts
index b0f763278a577..1dfe256d693f8 100644
--- a/packages/components/table/__tests__/table.spec.ts
+++ b/packages/components/table/__tests__/table.spec.ts
@@ -1,10 +1,11 @@
-import { VueWrapper } from '@vue/test-utils'
-import { ComponentPublicInstance, nextTick } from 'vue'
-import ElTable from '../src/table.vue'
-import ElTableColumn from '../src/table-column/index'
+import { nextTick } from 'vue'
 import ElCheckbox from '@element-plus/components/checkbox'
 import { triggerEvent } from '@element-plus/test-utils'
+import ElTable from '../src/table.vue'
+import ElTableColumn from '../src/table-column/index'
 import { mount, getTestData } from './table-test-common'
+import type { VueWrapper } from '@vue/test-utils'
+import type { ComponentPublicInstance } from 'vue'
 
 const { CheckboxGroup: ElCheckboxGroup } = ElCheckbox
 
diff --git a/packages/components/table/src/filter-panel.vue b/packages/components/table/src/filter-panel.vue
index c6b6fd512c5b8..dc81c9cec6345 100644
--- a/packages/components/table/src/filter-panel.vue
+++ b/packages/components/table/src/filter-panel.vue
@@ -88,8 +88,9 @@ import { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'
 import ElCheckbox from '@element-plus/components/checkbox'
 import { ClickOutside } from '@element-plus/directives'
 import { useLocaleInject } from '@element-plus/hooks'
-import ElPopper, { Effect, Placement } from '@element-plus/components/popper'
+import ElPopper, { Effect } from '@element-plus/components/popper'
 import ElScrollbar from '@element-plus/components/scrollbar'
+import type { Placement } from '@element-plus/components/popper'
 
 import type { WritableComputedRef, PropType } from 'vue'
 import type { TableColumnCtx } from './table-column/defaults'
diff --git a/packages/components/table/src/store/helper.ts b/packages/components/table/src/store/helper.ts
index 1b9ee0a99d5e8..3618f59f12422 100644
--- a/packages/components/table/src/store/helper.ts
+++ b/packages/components/table/src/store/helper.ts
@@ -3,8 +3,7 @@ import debounce from 'lodash/debounce'
 import useStore from '.'
 
 import type { Store } from '.'
-import type { Table } from '../table/defaults'
-import type { TableProps } from '../table/defaults'
+import type { Table, TableProps } from '../table/defaults'
 
 const InitialStateMap = {
   rowKey: 'rowKey',
diff --git a/packages/components/table/src/store/tree.ts b/packages/components/table/src/store/tree.ts
index 076c3e1acbcdc..3c7c511f5dbb0 100644
--- a/packages/components/table/src/store/tree.ts
+++ b/packages/components/table/src/store/tree.ts
@@ -1,5 +1,5 @@
-import { walkTreeNode, getRowIdentity } from '../util'
 import { ref, computed, watch, getCurrentInstance, unref } from 'vue'
+import { walkTreeNode, getRowIdentity } from '../util'
 
 import type { WatcherPropsData } from '.'
 import type { Table, TableProps } from '../table/defaults'
diff --git a/packages/components/table/src/table-body/events-helper.ts b/packages/components/table/src/table-body/events-helper.ts
index da471b4e8a223..9a75a7632e7d8 100644
--- a/packages/components/table/src/table-body/events-helper.ts
+++ b/packages/components/table/src/table-body/events-helper.ts
@@ -1,7 +1,7 @@
 import { getCurrentInstance, ref, h } from 'vue'
+import debounce from 'lodash/debounce'
 import { getStyle, hasClass } from '@element-plus/utils/dom'
 import { createTablePopper, getCell, getColumnByCell } from '../util'
-import debounce from 'lodash/debounce'
 
 import type { TableColumnCtx } from '../table-column/defaults'
 import type { Table } from '../table/defaults'
diff --git a/packages/components/table/src/table-body/index.ts b/packages/components/table/src/table-body/index.ts
index d6f196b68d072..90820a6390265 100644
--- a/packages/components/table/src/table-body/index.ts
+++ b/packages/components/table/src/table-body/index.ts
@@ -10,8 +10,8 @@ import { addClass, removeClass } from '@element-plus/utils/dom'
 import isServer from '@element-plus/utils/isServer'
 import { hColgroup } from '../h-helper'
 import useLayoutObserver from '../layout-observer'
-import useRender from './render-helper'
 import { removePopper } from '../util'
+import useRender from './render-helper'
 import defaultProps from './defaults'
 
 import type { VNode } from 'vue'
diff --git a/packages/components/table/src/table-body/render-helper.ts b/packages/components/table/src/table-body/render-helper.ts
index 7a3c4e766735d..a76339ef6bb89 100644
--- a/packages/components/table/src/table-body/render-helper.ts
+++ b/packages/components/table/src/table-body/render-helper.ts
@@ -1,11 +1,15 @@
 import { h, getCurrentInstance, computed } from 'vue'
+import { getRowIdentity } from '../util'
 import useEvents from './events-helper'
 import useStyles from './styles-helper'
-import { getRowIdentity } from '../util'
 
 import type { TableBodyProps } from './defaults'
-import type { RenderRowData, Table, TreeNode } from '../table/defaults'
-import type { TableProps } from '../table/defaults'
+import type {
+  RenderRowData,
+  Table,
+  TreeNode,
+  TableProps,
+} from '../table/defaults'
 
 function useRender<T>(props: Partial<TableBodyProps<T>>) {
   const instance = getCurrentInstance()
diff --git a/packages/components/table/src/table-column/defaults.ts b/packages/components/table/src/table-column/defaults.ts
index 3017a3d0cb06a..b5df5e253f724 100644
--- a/packages/components/table/src/table-column/defaults.ts
+++ b/packages/components/table/src/table-column/defaults.ts
@@ -1,7 +1,5 @@
-import type { PropType } from 'vue'
-import type { DefaultRow } from '../table/defaults'
-import type { ComponentInternalInstance, Ref, VNode } from 'vue'
-import type { Table } from '../table/defaults'
+import type { PropType, ComponentInternalInstance, Ref, VNode } from 'vue'
+import type { DefaultRow, Table } from '../table/defaults'
 
 type CI<T> = { column: TableColumnCtx<T>; $index: number }
 
diff --git a/packages/components/table/src/table-column/index.ts b/packages/components/table/src/table-column/index.ts
index 5b404005592e1..d8074c1f0604b 100644
--- a/packages/components/table/src/table-column/index.ts
+++ b/packages/components/table/src/table-column/index.ts
@@ -14,7 +14,8 @@ import { cellStarts } from '../config'
 import { mergeOptions, compose } from '../util'
 import useWatcher from './watcher-helper'
 import useRender from './render-helper'
-import defaultProps, { TableColumn, TableColumnCtx } from './defaults'
+import defaultProps from './defaults'
+import type { TableColumn, TableColumnCtx } from './defaults'
 
 import type { DefaultRow } from '../table/defaults'
 
diff --git a/packages/components/table/src/table-column/render-helper.ts b/packages/components/table/src/table-column/render-helper.ts
index 65a25640662a1..3d40fef269cdd 100644
--- a/packages/components/table/src/table-column/render-helper.ts
+++ b/packages/components/table/src/table-column/render-helper.ts
@@ -1,7 +1,7 @@
 import { getCurrentInstance, h, ref, computed, watchEffect } from 'vue'
+import { debugWarn } from '@element-plus/utils/error'
 import { cellForced, defaultRenderCell, treeCellPrefix } from '../config'
 import { parseWidth, parseMinWidth } from '../util'
-import { debugWarn } from '@element-plus/utils/error'
 
 import type { ComputedRef } from 'vue'
 import type { TableColumnCtx, TableColumn } from './defaults'
@@ -17,12 +17,12 @@ function useRender<T>(
   const realAlign = ref<string>()
   const realHeaderAlign = ref<string>()
   watchEffect(() => {
-    realAlign.value = !!props.align ? `is-${props.align}` : null
+    realAlign.value = props.align ? `is-${props.align}` : null
     // nextline help render
     realAlign.value
   })
   watchEffect(() => {
-    realHeaderAlign.value = !!props.headerAlign
+    realHeaderAlign.value = props.headerAlign
       ? `is-${props.headerAlign}`
       : realAlign.value
     // nextline help render
diff --git a/packages/components/table/src/table-footer/index.ts b/packages/components/table/src/table-footer/index.ts
index eb4560f9514fc..7cc3ec5573974 100644
--- a/packages/components/table/src/table-footer/index.ts
+++ b/packages/components/table/src/table-footer/index.ts
@@ -1,7 +1,7 @@
 import { defineComponent, h } from 'vue'
 import { hGutter, hColgroup } from '../h-helper'
-import { Store } from '../store'
 import useStyle from './style-helper'
+import type { Store } from '../store'
 
 import type { PropType } from 'vue'
 import type { DefaultRow, Sort, SummaryMethod } from '../table/defaults'
diff --git a/packages/components/table/src/table-header/index.ts b/packages/components/table/src/table-header/index.ts
index a2e79022f1b92..60fcecbd23fb8 100644
--- a/packages/components/table/src/table-header/index.ts
+++ b/packages/components/table/src/table-header/index.ts
@@ -10,10 +10,10 @@ import {
 import ElCheckbox from '@element-plus/components/checkbox'
 import FilterPanel from '../filter-panel.vue'
 import useLayoutObserver from '../layout-observer'
+import { hColgroup } from '../h-helper'
 import useEvent from './event-helper'
 import useStyle from './style.helper'
 import useUtils from './utils-helper'
-import { hColgroup } from '../h-helper'
 
 import type { ComponentInternalInstance, Ref, PropType } from 'vue'
 import type { DefaultRow, Sort, Table } from '../table/defaults'
diff --git a/packages/components/table/src/table-layout.ts b/packages/components/table/src/table-layout.ts
index 64d0a8390ef0b..67ceef053d3ce 100644
--- a/packages/components/table/src/table-layout.ts
+++ b/packages/components/table/src/table-layout.ts
@@ -3,8 +3,8 @@ import { hasOwn } from '@vue/shared'
 import scrollbarWidth from '@element-plus/utils/scrollbar-width'
 import isServer from '@element-plus/utils/isServer'
 import { parseHeight } from './util'
+import type { Ref } from 'vue'
 
-import { Ref } from 'vue'
 import type { TableColumnCtx } from './table-column/defaults'
 import type { TableHeader } from './table-header'
 import type { Table } from './table/defaults'
diff --git a/packages/components/table/src/table/style-helper.ts b/packages/components/table/src/table/style-helper.ts
index 8ce16ae95f1dc..458cde98c32e5 100644
--- a/packages/components/table/src/table/style-helper.ts
+++ b/packages/components/table/src/table/style-helper.ts
@@ -8,14 +8,14 @@ import {
   unref,
   nextTick,
 } from 'vue'
+import throttle from 'lodash/throttle'
 import {
   addResizeListener,
   removeResizeListener,
 } from '@element-plus/utils/resize-event'
-import throttle from 'lodash/throttle'
-import { parseHeight } from '../util'
 import { useGlobalConfig } from '@element-plus/utils/util'
 import { on, off } from '@element-plus/utils/dom'
+import { parseHeight } from '../util'
 
 import type { ResizableElement } from '@element-plus/utils/resize-event'
 import type { Table, TableProps } from './defaults'
diff --git a/packages/components/tabs/src/tab-bar.vue b/packages/components/tabs/src/tab-bar.vue
index ee455cd2ed0cc..1f62dd7ea7041 100644
--- a/packages/components/tabs/src/tab-bar.vue
+++ b/packages/components/tabs/src/tab-bar.vue
@@ -16,7 +16,7 @@ import {
 } from 'vue'
 import { capitalize } from '@vue/shared'
 import { Resize } from '@element-plus/directives'
-import { Pane, RootTabs } from './token'
+import type { Pane, RootTabs } from './token'
 
 import type { CSSProperties, PropType } from 'vue'
 
diff --git a/packages/components/tabs/src/tab-nav.vue b/packages/components/tabs/src/tab-nav.vue
index 00817d74c09d8..b71144611be14 100644
--- a/packages/components/tabs/src/tab-nav.vue
+++ b/packages/components/tabs/src/tab-nav.vue
@@ -14,11 +14,11 @@ import { EVENT_CODE } from '@element-plus/utils/aria'
 import {
   addResizeListener,
   removeResizeListener,
-  ResizableElement,
 } from '@element-plus/utils/resize-event'
 import { on, off } from '@element-plus/utils/dom'
 import { throwError } from '@element-plus/utils/error'
 import TabBar from './tab-bar.vue'
+import type { ResizableElement } from '@element-plus/utils/resize-event'
 
 import type { PropType } from 'vue'
 import type { Nullable } from '@element-plus/utils/types'
diff --git a/packages/components/time-picker/__tests__/time-picker.spec.ts b/packages/components/time-picker/__tests__/time-picker.spec.ts
index 5d3a22f13fc1e..4d28397670fd1 100644
--- a/packages/components/time-picker/__tests__/time-picker.spec.ts
+++ b/packages/components/time-picker/__tests__/time-picker.spec.ts
@@ -1,6 +1,6 @@
 import { nextTick } from 'vue'
-import dayjs from 'dayjs'
 import { mount } from '@vue/test-utils'
+import dayjs from 'dayjs'
 import { triggerEvent } from '@element-plus/test-utils'
 import TimePicker from '../src/time-picker'
 import Picker from '../src/common/picker.vue'
diff --git a/packages/components/time-picker/src/time-picker-com/basic-time-spinner.vue b/packages/components/time-picker/src/time-picker-com/basic-time-spinner.vue
index f13a41d873a3a..3e869624b05f8 100644
--- a/packages/components/time-picker/src/time-picker-com/basic-time-spinner.vue
+++ b/packages/components/time-picker/src/time-picker-com/basic-time-spinner.vue
@@ -68,21 +68,13 @@
   </div>
 </template>
 <script lang="ts">
-import {
-  defineComponent,
-  ref,
-  nextTick,
-  computed,
-  onMounted,
-  Ref,
-  watch,
-} from 'vue'
+import { defineComponent, ref, nextTick, computed, onMounted, watch } from 'vue'
 import debounce from 'lodash/debounce'
 import { RepeatClick } from '@element-plus/directives'
 import ElScrollbar from '@element-plus/components/scrollbar'
 import { getTimeLists } from './useTimePicker'
 
-import type { PropType } from 'vue'
+import type { PropType, Ref } from 'vue'
 import type { Dayjs } from 'dayjs'
 import type { Nullable } from '@element-plus/utils/types'
 
diff --git a/packages/components/time-select/src/time-select.vue b/packages/components/time-select/src/time-select.vue
index b22cf8198950c..04c85dc867950 100644
--- a/packages/components/time-select/src/time-select.vue
+++ b/packages/components/time-select/src/time-select.vue
@@ -28,9 +28,10 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, computed, ref, PropType } from 'vue'
+import { defineComponent, computed, ref } from 'vue'
 import ElSelect from '@element-plus/components/select'
-import { ComponentSize } from '@element-plus/utils/types'
+import type { PropType } from 'vue'
+import type { ComponentSize } from '@element-plus/utils/types'
 
 const { Option: ElOption } = ElSelect
 
diff --git a/packages/components/transfer/src/index.vue b/packages/components/transfer/src/index.vue
index 85aea9fb55cf1..f4e99c8e7b4ae 100644
--- a/packages/components/transfer/src/index.vue
+++ b/packages/components/transfer/src/index.vue
@@ -70,14 +70,13 @@ import { useLocaleInject } from '@element-plus/hooks'
 import { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'
 import TransferPanel from './transfer-panel.vue'
 import { useComputedData } from './useComputedData'
-import { useCheckedChange } from './useCheckedChange'
-import { useMove } from './useMove'
-import { CHANGE_EVENT } from './transfer'
-
 import {
+  useCheckedChange,
   LEFT_CHECK_CHANGE_EVENT,
   RIGHT_CHECK_CHANGE_EVENT,
 } from './useCheckedChange'
+import { useMove } from './useMove'
+import { CHANGE_EVENT } from './transfer'
 
 import type { PropType, VNode } from 'vue'
 import type { ElFormItemContext } from '@element-plus/tokens'
diff --git a/packages/components/transfer/src/useCheckedChange.ts b/packages/components/transfer/src/useCheckedChange.ts
index ddb676ff323df..3d74945d0e760 100644
--- a/packages/components/transfer/src/useCheckedChange.ts
+++ b/packages/components/transfer/src/useCheckedChange.ts
@@ -1,7 +1,7 @@
+import type { TransferCheckedState, Key } from './transfer'
+
 export const LEFT_CHECK_CHANGE_EVENT = 'left-check-change'
 export const RIGHT_CHECK_CHANGE_EVENT = 'right-check-change'
-
-import type { TransferCheckedState, Key } from './transfer'
 export const useCheckedChange = (checkedState: TransferCheckedState, emit) => {
   const onSourceCheckedChange = (val: Key[], movedKeys: Key[]) => {
     checkedState.leftChecked = val
diff --git a/packages/components/tree/__tests__/tree.spec.ts b/packages/components/tree/__tests__/tree.spec.ts
index ed2e82c706da8..f90fe8219a71a 100644
--- a/packages/components/tree/__tests__/tree.spec.ts
+++ b/packages/components/tree/__tests__/tree.spec.ts
@@ -1,7 +1,7 @@
-import { mount } from '@vue/test-utils'
 import { nextTick } from 'vue'
-import Tree from '../src/tree.vue'
+import { mount } from '@vue/test-utils'
 import { sleep, defineGetter } from '@element-plus/test-utils'
+import Tree from '../src/tree.vue'
 
 const ALL_NODE_COUNT = 9
 
diff --git a/packages/components/tree/src/model/node.ts b/packages/components/tree/src/model/node.ts
index 87f83b724687e..d53829036b05a 100644
--- a/packages/components/tree/src/model/node.ts
+++ b/packages/components/tree/src/model/node.ts
@@ -1,7 +1,7 @@
 import { reactive } from 'vue'
 import { hasOwn } from '@vue/shared'
 import { markNodeData, NODE_KEY } from './util'
-import TreeStore from './tree-store'
+import type TreeStore from './tree-store'
 
 import type { Nullable } from '@element-plus/utils/types'
 import type {
diff --git a/packages/components/tree/src/model/useDragNode.ts b/packages/components/tree/src/model/useDragNode.ts
index 846d76d3b593c..7914752ec3e39 100644
--- a/packages/components/tree/src/model/useDragNode.ts
+++ b/packages/components/tree/src/model/useDragNode.ts
@@ -1,6 +1,7 @@
-import { provide, ref, InjectionKey } from 'vue'
+import { provide, ref } from 'vue'
 import { addClass, removeClass } from '@element-plus/utils/dom'
-import Node from './node'
+import type { InjectionKey } from 'vue'
+import type Node from './node'
 
 interface TreeNode {
   node: Node
diff --git a/packages/components/tree/src/model/useKeydown.ts b/packages/components/tree/src/model/useKeydown.ts
index 2d51301eb48ff..957103eb3f793 100644
--- a/packages/components/tree/src/model/useKeydown.ts
+++ b/packages/components/tree/src/model/useKeydown.ts
@@ -1,7 +1,7 @@
 import { onMounted, onUpdated, onBeforeUnmount, watch, shallowRef } from 'vue'
 import { EVENT_CODE } from '@element-plus/utils/aria'
 import { on, off } from '@element-plus/utils/dom'
-import TreeStore from './tree-store'
+import type TreeStore from './tree-store'
 
 import type { Ref } from 'vue'
 import type { Nullable } from '@element-plus/utils/types'
diff --git a/packages/components/tree/src/model/useNodeExpandEventBroadcast.ts b/packages/components/tree/src/model/useNodeExpandEventBroadcast.ts
index 41844ec668a9e..e065e42b3022e 100644
--- a/packages/components/tree/src/model/useNodeExpandEventBroadcast.ts
+++ b/packages/components/tree/src/model/useNodeExpandEventBroadcast.ts
@@ -1,5 +1,5 @@
 import { inject, provide } from 'vue'
-import Node from '../model/node'
+import type Node from '../model/node'
 
 interface NodeMap {
   treeNodeExpand(node: Node): void
diff --git a/packages/components/tree/src/model/util.ts b/packages/components/tree/src/model/util.ts
index 95d1741ace5e4..e68eaa529e629 100644
--- a/packages/components/tree/src/model/util.ts
+++ b/packages/components/tree/src/model/util.ts
@@ -1,4 +1,4 @@
-import Node from './node'
+import type Node from './node'
 import type { TreeKey, TreeNodeData } from '../tree.type'
 
 export const NODE_KEY = '$treeNodeId'
diff --git a/packages/components/tree/src/tree-node.vue b/packages/components/tree/src/tree-node.vue
index 13df034df8768..27935c6bb7d0e 100644
--- a/packages/components/tree/src/tree-node.vue
+++ b/packages/components/tree/src/tree-node.vue
@@ -88,6 +88,7 @@ import {
 } from 'vue'
 import ElCollapseTransition from '@element-plus/components/collapse-transition'
 import ElCheckbox from '@element-plus/components/checkbox'
+import { debugWarn } from '@element-plus/utils/error'
 import NodeContent from './tree-node-content.vue'
 import { getNodeKey as getNodeKeyUtil } from './model/util'
 import { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'
@@ -97,7 +98,6 @@ import Node from './model/node'
 import type { ComponentInternalInstance, PropType } from 'vue'
 import type { Nullable } from '@element-plus/utils/types'
 import type { TreeOptionProps, TreeNodeData, RootTreeType } from './tree.type'
-import { debugWarn } from '@element-plus/utils/error'
 
 export default defineComponent({
   name: 'ElTreeNode',
diff --git a/packages/components/tree/src/tree.type.ts b/packages/components/tree/src/tree.type.ts
index 49d65cd428930..0bc39b5ce9353 100644
--- a/packages/components/tree/src/tree.type.ts
+++ b/packages/components/tree/src/tree.type.ts
@@ -1,8 +1,13 @@
-import { h } from 'vue'
-import Node from './model/node'
-import TreeStore from './model/tree-store'
+import type {
+  h,
+  ComponentInternalInstance,
+  Ref,
+  SetupContext,
+  VNode,
+} from 'vue'
+import type Node from './model/node'
+import type TreeStore from './model/tree-store'
 
-import type { ComponentInternalInstance, Ref, SetupContext, VNode } from 'vue'
 export interface RootTreeType {
   ctx: SetupContext<any>
   props: TreeComponentProps
diff --git a/packages/components/tree/src/tree.vue b/packages/components/tree/src/tree.vue
index 389345e4187b1..5c81548324e03 100644
--- a/packages/components/tree/src/tree.vue
+++ b/packages/components/tree/src/tree.vue
@@ -49,7 +49,7 @@ import ElTreeNode from './tree-node.vue'
 import { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'
 import { useDragNodeHandler } from './model/useDragNode'
 import { useKeydown } from './model/useKeydown'
-import Node from './model/node'
+import type Node from './model/node'
 
 import type { ComponentInternalInstance, PropType } from 'vue'
 import type { Nullable } from '@element-plus/utils/types'
diff --git a/packages/components/upload/src/upload-dragger.vue b/packages/components/upload/src/upload-dragger.vue
index f84205089f51f..37b248f5a4c6b 100644
--- a/packages/components/upload/src/upload-dragger.vue
+++ b/packages/components/upload/src/upload-dragger.vue
@@ -55,7 +55,7 @@ export default defineComponent({
               if (/\/\*$/.test(acceptedType)) {
                 return baseType === acceptedType.replace(/\/\*$/, '')
               }
-              if (/^[^\/]+\/[^\/]+$/.test(acceptedType)) {
+              if (/^[^/]+\/[^/]+$/.test(acceptedType)) {
                 return type === acceptedType
               }
               return false
diff --git a/packages/components/virtual-list/src/components/dynamic-size-grid.ts b/packages/components/virtual-list/src/components/dynamic-size-grid.ts
index c744648928740..ecd65fe5d18ff 100644
--- a/packages/components/virtual-list/src/components/dynamic-size-grid.ts
+++ b/packages/components/virtual-list/src/components/dynamic-size-grid.ts
@@ -5,12 +5,12 @@ import createGrid from '../builders/buildGrid'
 import {
   AUTO_ALIGNMENT,
   CENTERED_ALIGNMENT,
-  DefaultGridProps,
   DEFAULT_DYNAMIC_LIST_ITEM_SIZE,
   END_ALIGNMENT,
   SMART_ALIGNMENT,
   START_ALIGNMENT,
 } from '../defaults'
+import type { DefaultGridProps } from '../defaults'
 
 import type { ExtractPropTypes } from 'vue'
 import type { Alignment, GridCache, ListItem, ItemSize } from '../types'
diff --git a/packages/components/virtual-list/src/components/dynamic-size-list.ts b/packages/components/virtual-list/src/components/dynamic-size-list.ts
index 33da1f1619d2d..87d75d0428c35 100644
--- a/packages/components/virtual-list/src/components/dynamic-size-list.ts
+++ b/packages/components/virtual-list/src/components/dynamic-size-list.ts
@@ -7,11 +7,11 @@ import {
   AUTO_ALIGNMENT,
   CENTERED_ALIGNMENT,
   DEFAULT_DYNAMIC_LIST_ITEM_SIZE,
-  DefaultListProps,
   END_ALIGNMENT,
   SMART_ALIGNMENT,
   START_ALIGNMENT,
 } from '../defaults'
+import type { DefaultListProps } from '../defaults'
 
 import type { ListCache, ListItem, ItemSize } from '../types'
 import type { ExtractPropTypes } from 'vue'
diff --git a/packages/components/virtual-list/src/components/fixed-size-grid.ts b/packages/components/virtual-list/src/components/fixed-size-grid.ts
index 9dafc5ec4c0f3..3cf6817ed3a18 100644
--- a/packages/components/virtual-list/src/components/fixed-size-grid.ts
+++ b/packages/components/virtual-list/src/components/fixed-size-grid.ts
@@ -68,7 +68,7 @@ const FixedSizeGrid = createGrid({
         return maxOffset
       case END_ALIGNMENT:
         return minOffset
-      case CENTERED_ALIGNMENT:
+      case CENTERED_ALIGNMENT: {
         const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2)
         if (middleOffset < Math.ceil(width / 2)) {
           return 0
@@ -77,6 +77,7 @@ const FixedSizeGrid = createGrid({
         } else {
           return middleOffset
         }
+      }
       case AUTO_ALIGNMENT:
       default:
         if (scrollLeft >= minOffset && scrollLeft <= maxOffset) {
@@ -123,7 +124,7 @@ const FixedSizeGrid = createGrid({
         return maxOffset
       case END_ALIGNMENT:
         return minOffset
-      case CENTERED_ALIGNMENT:
+      case CENTERED_ALIGNMENT: {
         const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2)
         if (middleOffset < Math.ceil(height / 2)) {
           return 0
@@ -132,6 +133,7 @@ const FixedSizeGrid = createGrid({
         } else {
           return middleOffset
         }
+      }
       case AUTO_ALIGNMENT:
       default:
         if (scrollTop >= minOffset && scrollTop <= maxOffset) {
diff --git a/packages/components/virtual-list/src/components/fixed-size-list.ts b/packages/components/virtual-list/src/components/fixed-size-list.ts
index a0157ad280f67..daded57e32ecf 100644
--- a/packages/components/virtual-list/src/components/fixed-size-list.ts
+++ b/packages/components/virtual-list/src/components/fixed-size-list.ts
@@ -3,13 +3,13 @@ import { throwError } from '@element-plus/utils/error'
 import buildList from '../builders/buildList'
 import { isHorizontal } from '../utils'
 import {
-  DefaultListProps,
   SMART_ALIGNMENT,
   AUTO_ALIGNMENT,
   START_ALIGNMENT,
   END_ALIGNMENT,
   CENTERED_ALIGNMENT,
 } from '../defaults'
+import type { DefaultListProps } from '../defaults'
 
 import type { ExtractPropTypes } from 'vue'
 
diff --git a/packages/directives/__tests__/click-outside.spec.ts b/packages/directives/__tests__/click-outside.spec.ts
index 0e148e8fb92e5..afaa9a48b11e7 100644
--- a/packages/directives/__tests__/click-outside.spec.ts
+++ b/packages/directives/__tests__/click-outside.spec.ts
@@ -1,5 +1,5 @@
-import { mount } from '@vue/test-utils'
 import { withDirectives, h } from 'vue'
+import { mount } from '@vue/test-utils'
 import ClickOutside from '../click-outside'
 
 const AXIOM = 'Rem is the best girl'
diff --git a/packages/directives/__tests__/repeat-click.spec.ts b/packages/directives/__tests__/repeat-click.spec.ts
index eb9b34a4ebfd0..31d68e277db34 100644
--- a/packages/directives/__tests__/repeat-click.spec.ts
+++ b/packages/directives/__tests__/repeat-click.spec.ts
@@ -1,5 +1,5 @@
-import { sleep } from '@element-plus/test-utils'
 import { mount } from '@vue/test-utils'
+import { sleep } from '@element-plus/test-utils'
 import RepeatClick from '../repeat-click'
 
 const handler = jest.fn()
diff --git a/packages/directives/__tests__/trap-focus.spec.ts b/packages/directives/__tests__/trap-focus.spec.ts
index 5b515a49a2d49..08a527fec2033 100644
--- a/packages/directives/__tests__/trap-focus.spec.ts
+++ b/packages/directives/__tests__/trap-focus.spec.ts
@@ -2,12 +2,13 @@ import { nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
 import * as Aria from '@element-plus/utils/aria'
 
+import TrapFocus, { FOCUSABLE_CHILDREN } from '../trap-focus'
+import type { ITrapFocusElement } from '../trap-focus'
+
 const isVisibleMock = jest
   .spyOn(Aria, 'isVisible')
   .mockImplementation(() => true)
 
-import TrapFocus, { ITrapFocusElement, FOCUSABLE_CHILDREN } from '../trap-focus'
-
 let wrapper
 const _mount = (template: string) =>
   mount(
diff --git a/packages/directives/gulpfile.ts b/packages/directives/gulpfile.ts
index 736315b9eee54..2265518e34780 100644
--- a/packages/directives/gulpfile.ts
+++ b/packages/directives/gulpfile.ts
@@ -1,6 +1,6 @@
+import path from 'path'
 import gulp from 'gulp'
 import ts from 'gulp-typescript'
-import path from 'path'
 import { buildOutput } from '../../build/paths'
 import rewriter from '../../build/gulp-rewriter'
 
diff --git a/packages/hooks/__tests__/use-css-var.spec.ts b/packages/hooks/__tests__/use-css-var.spec.ts
index 2ed89f90e43ef..d78000d8adfe3 100644
--- a/packages/hooks/__tests__/use-css-var.spec.ts
+++ b/packages/hooks/__tests__/use-css-var.spec.ts
@@ -1,5 +1,5 @@
-import { mount } from '@vue/test-utils'
 import { ref } from 'vue'
+import { mount } from '@vue/test-utils'
 import { useCssVar } from '..'
 
 describe('usecssvar', () => {
diff --git a/packages/hooks/gulpfile.ts b/packages/hooks/gulpfile.ts
index c7680691c4075..c70010bed42a3 100644
--- a/packages/hooks/gulpfile.ts
+++ b/packages/hooks/gulpfile.ts
@@ -1,6 +1,6 @@
+import path from 'path'
 import gulp from 'gulp'
 import ts from 'gulp-typescript'
-import path from 'path'
 import { buildOutput } from '../../build/paths'
 import rewriter from '../../build/gulp-rewriter'
 
diff --git a/packages/hooks/use-attrs/index.ts b/packages/hooks/use-attrs/index.ts
index e8edcf3948ad4..63263f3b5aadc 100644
--- a/packages/hooks/use-attrs/index.ts
+++ b/packages/hooks/use-attrs/index.ts
@@ -1,6 +1,6 @@
 import { getCurrentInstance, computed } from 'vue'
-import { debugWarn } from '@element-plus/utils/error'
 import fromPairs from 'lodash/fromPairs'
+import { debugWarn } from '@element-plus/utils/error'
 
 import type { ComputedRef } from 'vue'
 
diff --git a/packages/hooks/use-migrating/index.ts b/packages/hooks/use-migrating/index.ts
index 2b67c1690d1b8..92426fdb4da1c 100644
--- a/packages/hooks/use-migrating/index.ts
+++ b/packages/hooks/use-migrating/index.ts
@@ -1,6 +1,6 @@
+import { getCurrentInstance, onMounted } from 'vue'
 import { debugWarn } from '@element-plus/utils/error'
 import { kebabCase } from '@element-plus/utils/util'
-import { getCurrentInstance, onMounted } from 'vue'
 
 const useMigrating = function () {
   onMounted(() => {
diff --git a/packages/locale/gulpfile.ts b/packages/locale/gulpfile.ts
index 725cb3f0bd711..ff66024cbcf8b 100644
--- a/packages/locale/gulpfile.ts
+++ b/packages/locale/gulpfile.ts
@@ -1,6 +1,6 @@
+import path from 'path'
 import gulp from 'gulp'
 import ts from 'gulp-typescript'
-import path from 'path'
 import { buildOutput } from '../../build/paths'
 
 export const esm = './es'
diff --git a/packages/locale/index.ts b/packages/locale/index.ts
index d74799fa68a6a..af644f52f3400 100644
--- a/packages/locale/index.ts
+++ b/packages/locale/index.ts
@@ -1,5 +1,5 @@
-import { debugWarn } from '@element-plus/utils/error'
 import dayjs from 'dayjs'
+import { debugWarn } from '@element-plus/utils/error'
 import defaultLang from './lang/en'
 
 export type TranslatePair = {
diff --git a/packages/test-utils/define-getter.ts b/packages/test-utils/define-getter.ts
index 4c249109bcec4..06e69cae0dff6 100644
--- a/packages/test-utils/define-getter.ts
+++ b/packages/test-utils/define-getter.ts
@@ -21,7 +21,7 @@ const defineGetter = (
       oldValue = obj[prop]
     } catch {
       throw Error(
-        `TypeError: Illegal invocation. Cannot read ${prop} of \'${obj}\', \'${obj}\' might be a prototype,  please specify default value instead.`
+        `TypeError: Illegal invocation. Cannot read ${prop} of '${obj}', '${obj}' might be a prototype,  please specify default value instead.`
       )
     }
   }
diff --git a/packages/theme-chalk/gulpfile.ts b/packages/theme-chalk/gulpfile.ts
index ad02d498800e9..0532f36c4155e 100644
--- a/packages/theme-chalk/gulpfile.ts
+++ b/packages/theme-chalk/gulpfile.ts
@@ -1,5 +1,6 @@
 /* eslint-disable no-console */
 
+import path from 'path'
 import chalk from 'chalk'
 import gulp from 'gulp'
 import gulpSass from 'gulp-sass'
@@ -9,8 +10,6 @@ import cleanCSS from 'gulp-clean-css'
 import rename from 'gulp-rename'
 import { buildOutput } from '../../build/paths'
 
-import path from 'path'
-
 const noElPrefixFile = /(index|base|display)/
 
 const sass = gulpSass(dartSass)
diff --git a/packages/tokens/gulpfile.ts b/packages/tokens/gulpfile.ts
index bd3edb7cb66ed..e1236db4de107 100644
--- a/packages/tokens/gulpfile.ts
+++ b/packages/tokens/gulpfile.ts
@@ -1,6 +1,6 @@
+import path from 'path'
 import gulp from 'gulp'
 import ts from 'gulp-typescript'
-import path from 'path'
 import { buildOutput } from '../../build/paths'
 import rewriter from '../../build/gulp-rewriter'
 
diff --git a/packages/utils/dom.ts b/packages/utils/dom.ts
index 1fb4910e49aa5..1d4f7d454004e 100644
--- a/packages/utils/dom.ts
+++ b/packages/utils/dom.ts
@@ -1,6 +1,6 @@
-import { CSSProperties } from 'vue'
 import isServer from './isServer'
 import { camelize, isObject } from './util'
+import type { CSSProperties } from 'vue'
 
 import type { Nullable } from './types'
 
diff --git a/packages/utils/gulpfile.ts b/packages/utils/gulpfile.ts
index 8e900c7b7ec91..a440994b89f5e 100644
--- a/packages/utils/gulpfile.ts
+++ b/packages/utils/gulpfile.ts
@@ -1,6 +1,6 @@
+import path from 'path'
 import gulp from 'gulp'
 import ts from 'gulp-typescript'
-import path from 'path'
 import { buildOutput } from '../../build/paths'
 
 import type { Settings } from 'gulp-typescript'
diff --git a/packages/utils/menu/submenu.ts b/packages/utils/menu/submenu.ts
index fc1a642f7db0b..8e4bc254aebf8 100644
--- a/packages/utils/menu/submenu.ts
+++ b/packages/utils/menu/submenu.ts
@@ -1,5 +1,5 @@
 import { EVENT_CODE, triggerEvent } from '../aria'
-import MenuItem from './menu-item'
+import type MenuItem from './menu-item'
 
 class SubMenu {
   public subMenuItems: NodeList
diff --git a/packages/utils/vnode.ts b/packages/utils/vnode.ts
index ab20d560f69f1..f77a87540c325 100644
--- a/packages/utils/vnode.ts
+++ b/packages/utils/vnode.ts
@@ -9,9 +9,9 @@ import {
   camelize,
 } from 'vue'
 
-import type { VNode, VNodeTypes, VNodeChild } from 'vue'
 import { hasOwn } from '@vue/shared'
 import { debugWarn } from './error'
+import type { VNode, VNodeTypes, VNodeChild } from 'vue'
 
 type Children = VNodeTypes[] | VNodeTypes
 
diff --git a/typings/vue-test-utils.d.ts b/typings/vue-test-utils.d.ts
index 29da8e60875fc..65ec89d1d0320 100644
--- a/typings/vue-test-utils.d.ts
+++ b/typings/vue-test-utils.d.ts
@@ -1,10 +1,12 @@
-import { ComponentPublicInstance, CSSProperties } from 'vue'
+import type { ComponentPublicInstance, CSSProperties } from 'vue'
 
 declare module '@vue/test-utils' {
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   interface DOMWrapper<ElementType> {
     style: CSSProperties
   }
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   interface VueWrapper<T extends ComponentPublicInstance> {
     style: CSSProperties
   }
diff --git a/yarn.lock b/yarn.lock
index b535604ffb610..db1bf6beb9dcb 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2982,6 +2982,11 @@
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.9.tgz#97edc9037ea0c38585320b28964dde3b39e4660d"
   integrity sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==
 
+"@types/json5@^0.0.29":
+  version "0.0.29"
+  resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
+  integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4=
+
 "@types/lodash@^4.14.161":
   version "4.14.172"
   resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.172.tgz#aad774c28e7bfd7a67de25408e03ee5a8c3d028a"
@@ -3786,6 +3791,17 @@ array-ify@^1.0.0:
   resolved "https://registry.yarnpkg.com/array-ify/-/array-ify-1.0.0.tgz#9e528762b4a9066ad163a6962a364418e9626ece"
   integrity sha1-nlKHYrSpBmrRY6aWKjZEGOlibs4=
 
+array-includes@^3.1.3:
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.1.3.tgz#c7f619b382ad2afaf5326cddfdc0afc61af7690a"
+  integrity sha512-gcem1KlBU7c9rB+Rq8/3PPKsK2kjqeEBa3bD5kkQo4nYlOHQCJqIJFqBXDEfwaRuYTT4E+FxA9xez7Gf/e3Q7A==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.1.3"
+    es-abstract "^1.18.0-next.2"
+    get-intrinsic "^1.1.1"
+    is-string "^1.0.5"
+
 array-initial@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/array-initial/-/array-initial-1.1.0.tgz#2fa74b26739371c3947bd7a7adc73be334b3d795"
@@ -3837,6 +3853,15 @@ array-unique@^0.3.2:
   resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
   integrity sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=
 
+array.prototype.flat@^1.2.4:
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/array.prototype.flat/-/array.prototype.flat-1.2.4.tgz#6ef638b43312bd401b4c6199fdec7e2dc9e9a123"
+  integrity sha512-4470Xi3GAPAjZqFcljX2xzckv1qeKPizoNkiS0+O4IoPR2ZNpcjE0pkhdihlDouK+x6QOast26B4Q/O9DJnwSg==
+  dependencies:
+    call-bind "^1.0.0"
+    define-properties "^1.1.3"
+    es-abstract "^1.18.0-next.1"
+
 arrify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
@@ -5352,7 +5377,7 @@ debug@4, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1, debug@^4.3.1:
   dependencies:
     ms "2.1.2"
 
-debug@^2.2.0, debug@^2.3.3:
+debug@^2.2.0, debug@^2.3.3, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
   integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==
@@ -5366,6 +5391,13 @@ debug@^3.1.0:
   dependencies:
     ms "^2.1.1"
 
+debug@^3.2.7:
+  version "3.2.7"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a"
+  integrity sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==
+  dependencies:
+    ms "^2.1.1"
+
 debuglog@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492"
@@ -5534,6 +5566,13 @@ dir-glob@^3.0.1:
   dependencies:
     path-type "^4.0.0"
 
+doctrine@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-2.1.0.tgz#5cd01fc101621b42c4cd7f5d1a66243716d3f39d"
+  integrity sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==
+  dependencies:
+    esutils "^2.0.2"
+
 doctrine@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961"
@@ -5741,6 +5780,30 @@ es-abstract@^1.17.0-next.1:
     string.prototype.trimend "^1.0.1"
     string.prototype.trimstart "^1.0.1"
 
+es-abstract@^1.18.0-next.1, es-abstract@^1.18.0-next.2, es-abstract@^1.18.2:
+  version "1.18.6"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.18.6.tgz#2c44e3ea7a6255039164d26559777a6d978cb456"
+  integrity sha512-kAeIT4cku5eNLNuUKhlmtuk1/TRZvQoYccn6TO0cSVdf1kzB0T7+dYuVK9MWM7l+/53W2Q8M7N2c6MQvhXFcUQ==
+  dependencies:
+    call-bind "^1.0.2"
+    es-to-primitive "^1.2.1"
+    function-bind "^1.1.1"
+    get-intrinsic "^1.1.1"
+    get-symbol-description "^1.0.0"
+    has "^1.0.3"
+    has-symbols "^1.0.2"
+    internal-slot "^1.0.3"
+    is-callable "^1.2.4"
+    is-negative-zero "^2.0.1"
+    is-regex "^1.1.4"
+    is-string "^1.0.7"
+    object-inspect "^1.11.0"
+    object-keys "^1.1.1"
+    object.assign "^4.1.2"
+    string.prototype.trimend "^1.0.4"
+    string.prototype.trimstart "^1.0.4"
+    unbox-primitive "^1.0.1"
+
 es-to-primitive@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a"
@@ -5859,6 +5922,43 @@ eslint-config-prettier@^8.3.0:
   resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.3.0.tgz#f7471b20b6fe8a9a9254cc684454202886a2dd7a"
   integrity sha512-BgZuLUSeKzvlL/VUjx/Yb787VQ26RU3gGjA3iiFvdsp/2bMfVIWUVP7tjxtjS0e+HP409cPlPvNkQloz8C91ew==
 
+eslint-import-resolver-node@^0.3.6:
+  version "0.3.6"
+  resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.6.tgz#4048b958395da89668252001dbd9eca6b83bacbd"
+  integrity sha512-0En0w03NRVMn9Uiyn8YRPDKvWjxCWkslUEhGNTdGx15RvPJYQ+lbOlqrlNI2vEAs4pDYK4f/HN2TbDmk5TP0iw==
+  dependencies:
+    debug "^3.2.7"
+    resolve "^1.20.0"
+
+eslint-module-utils@^2.6.2:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/eslint-module-utils/-/eslint-module-utils-2.6.2.tgz#94e5540dd15fe1522e8ffa3ec8db3b7fa7e7a534"
+  integrity sha512-QG8pcgThYOuqxupd06oYTZoNOGaUdTY1PqK+oS6ElF6vs4pBdk/aYxFVQQXzcrAqp9m7cl7lb2ubazX+g16k2Q==
+  dependencies:
+    debug "^3.2.7"
+    pkg-dir "^2.0.0"
+
+eslint-plugin-import@^2.24.2:
+  version "2.24.2"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.24.2.tgz#2c8cd2e341f3885918ee27d18479910ade7bb4da"
+  integrity sha512-hNVtyhiEtZmpsabL4neEj+6M5DCLgpYyG9nzJY8lZQeQXEn5UPW1DpUdsMHMXsq98dbNm7nt1w9ZMSVpfJdi8Q==
+  dependencies:
+    array-includes "^3.1.3"
+    array.prototype.flat "^1.2.4"
+    debug "^2.6.9"
+    doctrine "^2.1.0"
+    eslint-import-resolver-node "^0.3.6"
+    eslint-module-utils "^2.6.2"
+    find-up "^2.0.0"
+    has "^1.0.3"
+    is-core-module "^2.6.0"
+    minimatch "^3.0.4"
+    object.values "^1.1.4"
+    pkg-up "^2.0.0"
+    read-pkg-up "^3.0.0"
+    resolve "^1.20.0"
+    tsconfig-paths "^3.11.0"
+
 eslint-plugin-prettier@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-4.0.0.tgz#8b99d1e4b8b24a762472b4567992023619cb98e0"
@@ -6351,7 +6451,7 @@ find-up@^1.0.0:
     path-exists "^2.0.0"
     pinkie-promise "^2.0.0"
 
-find-up@^2.0.0:
+find-up@^2.0.0, find-up@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7"
   integrity sha1-RdG35QbHF93UgndaK3eSCjwMV6c=
@@ -6628,7 +6728,7 @@ get-caller-file@^2.0.1, get-caller-file@^2.0.5:
   resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-2.0.5.tgz#4f94412a82db32f36e3b0b9741f8a97feb031f7e"
   integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==
 
-get-intrinsic@^1.0.2:
+get-intrinsic@^1.0.2, get-intrinsic@^1.1.0, get-intrinsic@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.1.1.tgz#15f59f376f855c446963948f0d24cd3637b4abc6"
   integrity sha512-kWZrnVM42QCiEA2Ig1bG8zjoIMOgxWwYCEeNdwY6Tv/cOSeGpcoX4pXHfKUxNKVoArnrEr2e9srnAxxGIraS9Q==
@@ -6687,6 +6787,14 @@ get-stream@^6.0.0:
   resolved "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz#a262d8eef67aced57c2852ad6167526a43cbf7b7"
   integrity sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==
 
+get-symbol-description@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/get-symbol-description/-/get-symbol-description-1.0.0.tgz#7fdb81c900101fbd564dd5f1a30af5aadc1e58d6"
+  integrity sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==
+  dependencies:
+    call-bind "^1.0.2"
+    get-intrinsic "^1.1.1"
+
 get-value@^2.0.3, get-value@^2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/get-value/-/get-value-2.0.6.tgz#dc15ca1c672387ca76bd37ac0a395ba2042a2c28"
@@ -7066,6 +7174,11 @@ hard-rejection@^2.1.0:
   resolved "https://registry.yarnpkg.com/hard-rejection/-/hard-rejection-2.1.0.tgz#1c6eda5c1685c63942766d79bb40ae773cecd883"
   integrity sha512-VIZB+ibDhx7ObhAe7OVtoEbuP4h/MuOTHJ+J8h/eBXotJYl0fBgR72xDFCKgIh22OJZIOVNxBMWuhAr10r8HdA==
 
+has-bigints@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113"
+  integrity sha512-LSBS2LjbNBTf6287JEbEzvJgftkF5qFkmCo9hDRpAzKhUOlJ+hx8dd4USs00SgsUNwc4617J9ki5YtEClM2ffA==
+
 has-flag@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
@@ -7449,6 +7562,15 @@ inquirer@6.5.2, inquirer@^6.2.0:
     strip-ansi "^5.1.0"
     through "^2.3.6"
 
+internal-slot@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.3.tgz#7347e307deeea2faac2ac6205d4bc7d34967f59c"
+  integrity sha512-O0DB1JC/sPyZl7cIo78n5dR7eUSwwpYPiXRhTzNxZVAMUuB8vlnRFyLxdrVToks6XPLVnFfbzaVd5WLjhgg+vA==
+  dependencies:
+    get-intrinsic "^1.1.0"
+    has "^1.0.3"
+    side-channel "^1.0.4"
+
 interpret@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.4.0.tgz#665ab8bc4da27a774a40584e812e3e0fa45b1a1e"
@@ -7496,6 +7618,13 @@ is-arrayish@^0.2.1:
   resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"
   integrity sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=
 
+is-bigint@^1.0.1:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/is-bigint/-/is-bigint-1.0.4.tgz#08147a1875bc2b32005d41ccd8291dffc6691df3"
+  integrity sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==
+  dependencies:
+    has-bigints "^1.0.1"
+
 is-binary-path@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/is-binary-path/-/is-binary-path-1.0.1.tgz#75f16642b480f187a711c814161fd3a4a7655898"
@@ -7510,12 +7639,20 @@ is-binary-path@~2.1.0:
   dependencies:
     binary-extensions "^2.0.0"
 
+is-boolean-object@^1.1.0:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/is-boolean-object/-/is-boolean-object-1.1.2.tgz#5c6dc200246dd9321ae4b885a114bb1f75f63719"
+  integrity sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==
+  dependencies:
+    call-bind "^1.0.2"
+    has-tostringtag "^1.0.0"
+
 is-buffer@^1.1.5:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
   integrity sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==
 
-is-callable@^1.1.4, is-callable@^1.2.2:
+is-callable@^1.1.4, is-callable@^1.2.2, is-callable@^1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.4.tgz#47301d58dd0259407865547853df6d61fe471945"
   integrity sha512-nsuwtxZfMX67Oryl9LCQ+upnC0Z0BgpwntpS89m1H/TLF0zNfzfLMV/9Wa/6MZsj0acpEjAO0KF1xT6ZdLl95w==
@@ -7534,7 +7671,7 @@ is-core-module@^2.1.0:
   dependencies:
     has "^1.0.3"
 
-is-core-module@^2.2.0:
+is-core-module@^2.2.0, is-core-module@^2.6.0:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.6.0.tgz#d7553b2526fe59b92ba3e40c8df757ec8a709e19"
   integrity sha512-wShG8vs60jKfPWpF2KZRaAtvt3a20OAn7+IJ6hLPECpSABLcKtFKTTI4ZtH5QcBruBHlq+WsdHWyz0BCZW7svQ==
@@ -7671,6 +7808,18 @@ is-negated-glob@^1.0.0:
   resolved "https://registry.yarnpkg.com/is-negated-glob/-/is-negated-glob-1.0.0.tgz#6910bca5da8c95e784b5751b976cf5a10fee36d2"
   integrity sha1-aRC8pdqMleeEtXUbl2z1oQ/uNtI=
 
+is-negative-zero@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.1.tgz#3de746c18dda2319241a53675908d8f766f11c24"
+  integrity sha512-2z6JzQvZRa9A2Y7xC6dQQm4FSTSTNWjKIYYTt4246eMTJmIo0Q+ZyOsU66X8lxK1AbB92dFeglPLrhwpeRKO6w==
+
+is-number-object@^1.0.4:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.0.6.tgz#6a7aaf838c7f0686a50b4553f7e54a96494e89f0"
+  integrity sha512-bEVOqiRcvo3zO1+G2lVMy+gkkEm9Yh7cDMRusKKu5ZJKPUYSJwICTKZrNKHA2EbSP0Tu0+6B/emsYNHZyn6K8g==
+  dependencies:
+    has-tostringtag "^1.0.0"
+
 is-number@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195"
@@ -7732,7 +7881,7 @@ is-reference@^1.2.1:
   dependencies:
     "@types/estree" "*"
 
-is-regex@^1.0.3, is-regex@^1.1.1:
+is-regex@^1.0.3, is-regex@^1.1.1, is-regex@^1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958"
   integrity sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==
@@ -7769,7 +7918,14 @@ is-stream@^2.0.0:
   resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-2.0.0.tgz#bde9c32680d6fae04129d6ac9d921ce7815f78e3"
   integrity sha512-XCoy+WlUr7d1+Z8GgSuXmpuUFC9fOhRXglJMx+dwLKTkL44Cjd4W1Z5P+BQZpr+cR93aGP4S/s7Ftw6Nd/kiEw==
 
-is-symbol@^1.0.2:
+is-string@^1.0.5, is-string@^1.0.7:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/is-string/-/is-string-1.0.7.tgz#0dd12bf2006f255bb58f695110eff7491eebc0fd"
+  integrity sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==
+  dependencies:
+    has-tostringtag "^1.0.0"
+
+is-symbol@^1.0.2, is-symbol@^1.0.3:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/is-symbol/-/is-symbol-1.0.4.tgz#a6dac93b635b063ca6872236de88910a57af139c"
   integrity sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==
@@ -9702,7 +9858,7 @@ object-copy@^0.1.0:
     define-property "^0.2.5"
     kind-of "^3.0.3"
 
-object-inspect@^1.8.0:
+object-inspect@^1.11.0, object-inspect@^1.8.0, object-inspect@^1.9.0:
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.11.0.tgz#9dceb146cedd4148a0d9e51ab88d34cf509922b1"
   integrity sha512-jp7ikS6Sd3GxQfZJPyH3cjcbJF6GZPClgdV+EFygjFLQ5FmW/dRUnTd9PQ9k0JhoNDabWFbpF1yCdSWCC6gexg==
@@ -9729,7 +9885,7 @@ object.assign@^4.0.4:
     has-symbols "^1.0.0"
     object-keys "^1.0.11"
 
-object.assign@^4.1.0, object.assign@^4.1.1:
+object.assign@^4.1.0, object.assign@^4.1.1, object.assign@^4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.2.tgz#0ed54a342eceb37b38ff76eb831a0e788cb63940"
   integrity sha512-ixT2L5THXsApyiUPYKmW+2EHpXXe5Ii3M+f4e+aJFAHao5amFRW6J0OO6c/LU8Be47utCx2GL89hxGB6XSmKuQ==
@@ -9780,6 +9936,15 @@ object.reduce@^1.0.0:
     for-own "^1.0.0"
     make-iterator "^1.0.0"
 
+object.values@^1.1.4:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.4.tgz#0d273762833e816b693a637d30073e7051535b30"
+  integrity sha512-TnGo7j4XSnKQoK3MfvkzqKCi0nVe/D9I9IjwTNYdb/fxYHpjrluHVOgw0AF6jrRFGMPHdfuidR09tIDiIvnaSg==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.1.3"
+    es-abstract "^1.18.2"
+
 octokit-pagination-methods@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/octokit-pagination-methods/-/octokit-pagination-methods-1.1.0.tgz#cf472edc9d551055f9ef73f6e42b4dbb4c80bea4"
@@ -10224,6 +10389,13 @@ pirates@^4.0.1:
   dependencies:
     node-modules-regexp "^1.0.0"
 
+pkg-dir@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-2.0.0.tgz#f6d5d1109e19d63edf428e0bd57e12777615334b"
+  integrity sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s=
+  dependencies:
+    find-up "^2.1.0"
+
 pkg-dir@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-3.0.0.tgz#2749020f239ed990881b1f71210d51eb6523bea3"
@@ -10238,6 +10410,13 @@ pkg-dir@^4.1.0, pkg-dir@^4.2.0:
   dependencies:
     find-up "^4.0.0"
 
+pkg-up@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-2.0.0.tgz#c819ac728059a461cab1c3889a2be3c49a004d7f"
+  integrity sha1-yBmscoBZpGHKscOImivjxJoATX8=
+  dependencies:
+    find-up "^2.1.0"
+
 pkg-up@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-3.1.0.tgz#100ec235cc150e4fd42519412596a28512a0def5"
@@ -11084,7 +11263,7 @@ resolve@1.17.0, resolve@1.x, resolve@^1.1.6, resolve@^1.1.7, resolve@^1.10.0, re
   dependencies:
     path-parse "^1.0.6"
 
-resolve@^1.13.1, resolve@^1.14.2, resolve@^1.15.1:
+resolve@^1.13.1, resolve@^1.14.2, resolve@^1.15.1, resolve@^1.20.0:
   version "1.20.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.20.0.tgz#629a013fb3f70755d6f0b7935cc1c2c5378b1975"
   integrity sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==
@@ -11414,6 +11593,15 @@ shellwords@^0.1.1:
   resolved "https://registry.yarnpkg.com/shellwords/-/shellwords-0.1.1.tgz#d6b9181c1a48d397324c84871efbcfc73fc0654b"
   integrity sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==
 
+side-channel@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.4.tgz#efce5c8fdc104ee751b25c58d4290011fa5ea2cf"
+  integrity sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==
+  dependencies:
+    call-bind "^1.0.0"
+    get-intrinsic "^1.0.2"
+    object-inspect "^1.9.0"
+
 signal-exit@^3.0.0, signal-exit@^3.0.2, signal-exit@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.3.tgz#a1410c2edd8f077b08b4e253c8eacfcaf057461c"
@@ -11770,7 +11958,7 @@ string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0:
     is-fullwidth-code-point "^3.0.0"
     strip-ansi "^6.0.0"
 
-string.prototype.trimend@^1.0.1:
+string.prototype.trimend@^1.0.1, string.prototype.trimend@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.4.tgz#e75ae90c2942c63504686c18b287b4a0b1a45f80"
   integrity sha512-y9xCjw1P23Awk8EvTpcyL2NIr1j7wJ39f+k6lvRnSMz+mz9CGz9NYPelDk42kOz6+ql8xjfK8oYzy3jAP5QU5A==
@@ -11778,7 +11966,7 @@ string.prototype.trimend@^1.0.1:
     call-bind "^1.0.2"
     define-properties "^1.1.3"
 
-string.prototype.trimstart@^1.0.1:
+string.prototype.trimstart@^1.0.1, string.prototype.trimstart@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.4.tgz#b36399af4ab2999b4c9c648bd7a3fb2bb26feeed"
   integrity sha512-jh6e984OBfvxS50tdY2nRZnoC5/mLFKOREQfw8t5yytkoUsJRNxvI/E39qu1sD0OtWI3OC0XgKSmcWwziwYuZw==
@@ -12299,6 +12487,16 @@ ts-node@^10.1.0:
     make-error "^1.1.1"
     yn "3.1.1"
 
+tsconfig-paths@^3.11.0:
+  version "3.11.0"
+  resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.11.0.tgz#954c1fe973da6339c78e06b03ce2e48810b65f36"
+  integrity sha512-7ecdYDnIdmv639mmDwslG6KQg1Z9STTz1j7Gcz0xa+nshh/gKDAHcPxRbWOsA3SPp0tXP2leTcY9Kw+NAkfZzA==
+  dependencies:
+    "@types/json5" "^0.0.29"
+    json5 "^1.0.1"
+    minimist "^1.2.0"
+    strip-bom "^3.0.0"
+
 tslib@2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.0.1.tgz#410eb0d113e5b6356490eec749603725b021b43e"
@@ -12424,6 +12622,16 @@ umask@^1.1.0:
   resolved "https://registry.yarnpkg.com/umask/-/umask-1.1.0.tgz#f29cebf01df517912bb58ff9c4e50fde8e33320d"
   integrity sha1-8pzr8B31F5ErtY/5xOUP3o4zMg0=
 
+unbox-primitive@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.1.tgz#085e215625ec3162574dc8859abee78a59b14471"
+  integrity sha512-tZU/3NqK3dA5gpE1KtyiJUrEB0lxnGkMFHptJ7q6ewdZ8s12QrODwNbhIJStmJkd1QDXa1NRA8aF2A1zk/Ypyw==
+  dependencies:
+    function-bind "^1.1.1"
+    has-bigints "^1.0.1"
+    has-symbols "^1.0.2"
+    which-boxed-primitive "^1.0.2"
+
 unc-path-regex@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/unc-path-regex/-/unc-path-regex-0.1.2.tgz#e73dd3d7b0d7c5ed86fbac6b0ae7d8c6a69d50fa"
@@ -12968,6 +13176,17 @@ whatwg-url@^8.0.0:
     tr46 "^2.0.2"
     webidl-conversions "^6.1.0"
 
+which-boxed-primitive@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz#13757bc89b209b049fe5d86430e21cf40a89a8e6"
+  integrity sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==
+  dependencies:
+    is-bigint "^1.0.1"
+    is-boolean-object "^1.1.0"
+    is-number-object "^1.0.4"
+    is-string "^1.0.5"
+    is-symbol "^1.0.3"
+
 which-module@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f"