refactor: enforce consistent usage of type imports (#2734)

Author: marcalexiei

eslint.config.mjs

@@ -1,30 +1,26 @@
+import { defineConfig, globalIgnores } from 'eslint/config'
 import eslint from '@eslint/js'
 import tseslint from 'typescript-eslint'
 import prettierPluginRecommended from 'eslint-plugin-prettier/recommended'
 
-export default [
+export default defineConfig(
+  globalIgnores(['docs/.vitepress', 'coverage', 'dist']),
   {
-    ignores: ['docs/.vitepress', 'coverage', 'dist']
-  },
-  ...tseslint.config({
     extends: [
       eslint.configs.recommended,
       ...tseslint.configs.recommended,
       prettierPluginRecommended
     ],
     rules: {
       'prettier/prettier': ['error'],
-      'no-restricted-imports': [
-        'error',
-        {
-          patterns: ['src/*']
-        }
-      ],
+      'no-restricted-imports': ['error', { patterns: ['src/*'] }],
+
+      '@typescript-eslint/consistent-type-imports': 'error',
 
       // Currently, disabled to avoid a lot of changes during migration
       '@typescript-eslint/no-explicit-any': 'off',
       '@typescript-eslint/no-unused-vars': 'off',
       '@typescript-eslint/ban-ts-comment': 'off'
     }
-  })
-]
+  }
+)

src/baseWrapper.ts

@@ -1,36 +1,37 @@
-import { VNode } from 'vue'
+import type { VNode } from 'vue'
 import { textContent } from './utils'
 import type { TriggerOptions } from './createDomEvent'
-import {
+import type {
   ComponentInternalInstance,
   ComponentOptions,
   ComponentPublicInstance,
   ComputedOptions,
   CreateComponentPublicInstance,
   FunctionalComponent,
-  MethodOptions,
-  nextTick
+  MethodOptions
 } from 'vue'
+import { nextTick } from 'vue'
 import { createDOMEvent } from './createDomEvent'
-import { DomEventNameWithModifier } from './constants/dom-events'
+import type { DomEventNameWithModifier } from './constants/dom-events'
 import type { VueWrapper } from './vueWrapper'
-import {
+import type {
   DefinedComponent,
   FindAllComponentsSelector,
   FindComponentSelector,
   NameSelector,
   RefSelector,
   VueNode
 } from './types'
-import WrapperLike from './interfaces/wrapperLike'
+import type WrapperLike from './interfaces/wrapperLike'
 import { find, matches } from './utils/find'
 import { createWrapperError } from './errorWrapper'
 import { isElementVisible } from './utils/isElementVisible'
 import { isElement } from './utils/isElement'
 import type { DOMWrapper } from './domWrapper'
 import { createDOMWrapper, createVueWrapper } from './wrapperFactory'
 import { stringifyNode } from './utils/stringifyNode'
-import beautify, { HTMLBeautifyOptions } from 'js-beautify'
+import type { HTMLBeautifyOptions } from 'js-beautify'
+import beautify from 'js-beautify'
 
 export default abstract class BaseWrapper<ElementType extends Node>
   implements WrapperLike

src/config.ts

@@ -1,7 +1,7 @@
-import { GlobalMountOptions, Stub } from './types'
-import { VueWrapper } from './vueWrapper'
-import { DOMWrapper } from './domWrapper'
-import { CustomCreateStub } from './vnodeTransformers/stubComponentsTransformer'
+import type { GlobalMountOptions, Stub } from './types'
+import type { VueWrapper } from './vueWrapper'
+import type { DOMWrapper } from './domWrapper'
+import type { CustomCreateStub } from './vnodeTransformers/stubComponentsTransformer'
 
 export interface GlobalConfigOptions {
   global: Required<Omit<GlobalMountOptions, 'stubs'>> & {

src/createDomEvent.ts

@@ -1,9 +1,11 @@
-import domEvents, {
+import type {
   DomEvent,
   DomEventName,
   DomEventNameWithModifier,
+  Modifier
+} from './constants/dom-events'
+import domEvents, {
   KeyName,
-  Modifier,
   ignorableKeyModifiers,
   systemKeyModifiers,
   mouseKeyModifiers,

src/createInstance.ts

@@ -1,19 +1,21 @@
+import type {
+  AppConfig,
+  ComponentOptions,
+  ConcreteComponent,
+  DefineComponent
+} from 'vue'
 import {
   h,
   createApp,
   defineComponent,
   reactive,
   shallowReactive,
   ref,
-  AppConfig,
-  ComponentOptions,
-  ConcreteComponent,
-  DefineComponent,
   transformVNodeArgs,
   proxyRefs
 } from 'vue'
 
-import { MountingOptions, Slot } from './types'
+import type { MountingOptions, Slot } from './types'
 import {
   getComponentsFromStubs,
   getDirectivesFromStubs,
@@ -32,10 +34,8 @@ import {
   unwrapLegacyVueExtendComponent
 } from './utils/vueCompatSupport'
 import { createVNodeTransformer } from './vnodeTransformers/util'
-import {
-  createStubComponentsTransformer,
-  CreateStubComponentsTransformerConfig
-} from './vnodeTransformers/stubComponentsTransformer'
+import type { CreateStubComponentsTransformerConfig } from './vnodeTransformers/stubComponentsTransformer'
+import { createStubComponentsTransformer } from './vnodeTransformers/stubComponentsTransformer'
 import { createStubDirectivesTransformer } from './vnodeTransformers/stubDirectivesTransformer'
 import { isDeepRef } from './utils/isDeepRef'
 

src/domWrapper.ts

@@ -1,13 +1,13 @@
-import { VNode } from 'vue'
+import type { VNode } from 'vue'
 import { config } from './config'
 import BaseWrapper from './baseWrapper'
-import WrapperLike from './interfaces/wrapperLike'
+import type WrapperLike from './interfaces/wrapperLike'
 import {
   createDOMWrapper,
   registerFactory,
   WrapperType
 } from './wrapperFactory'
-import { RefSelector } from './types'
+import type { RefSelector } from './types'
 import { isRefSelector } from './utils'
 import { createWrapperError } from './errorWrapper'
 

src/emit.ts

@@ -1,9 +1,9 @@
-import {
-  setDevtoolsHook,
+import type {
   devtools,
   ComponentPublicInstance,
   ComponentInternalInstance
 } from 'vue'
+import { setDevtoolsHook } from 'vue'
 import { getGlobalThis } from './utils'
 
 type Events<T = unknown> = Record<number, Record<string, T[]>>

src/index.ts

@@ -3,12 +3,13 @@ import { VueWrapper } from './vueWrapper'
 import BaseWrapper from './baseWrapper'
 import { mount, shallowMount } from './mount'
 import { renderToString } from './renderToString'
-import { MountingOptions, Stubs } from './types'
+import type { MountingOptions, Stubs } from './types'
 import { RouterLinkStub } from './components/RouterLinkStub'
 import { createWrapperError } from './errorWrapper'
 import { config } from './config'
 import { flushPromises } from './utils/flushPromises'
 import { enableAutoUnmount, disableAutoUnmount } from './utils/autoUnmount'
+import type { ComponentMountingOptions } from './mount'
 
 export {
   mount,
@@ -22,9 +23,7 @@ export {
   BaseWrapper,
   config,
   flushPromises,
-  MountingOptions,
-  Stubs,
   createWrapperError
 }
 
-export type { ComponentMountingOptions } from './mount'
+export type { MountingOptions, Stubs, ComponentMountingOptions }

src/interfaces/wrapperLike.ts

@@ -1,14 +1,14 @@
-import { DomEventNameWithModifier } from '../constants/dom-events'
-import { TriggerOptions } from '../createDomEvent'
-import {
+import type { DomEventNameWithModifier } from '../constants/dom-events'
+import type { TriggerOptions } from '../createDomEvent'
+import type {
   DefinedComponent,
   FindAllComponentsSelector,
   FindComponentSelector,
   NameSelector,
   RefSelector
 } from '../types'
-import { VueWrapper } from '../vueWrapper'
-import { ComponentPublicInstance, FunctionalComponent } from 'vue'
+import type { VueWrapper } from '../vueWrapper'
+import type { ComponentPublicInstance, FunctionalComponent } from 'vue'
 import type { DOMWrapper } from '../domWrapper'
 
 export default interface WrapperLike {

src/mount.ts

@@ -1,13 +1,13 @@
-import { ComponentPublicInstance, DefineComponent, VNode } from 'vue'
+import type { ComponentPublicInstance, DefineComponent, VNode } from 'vue'
 import type {
   ComponentExposed,
   ComponentProps,
   ComponentSlots
 } from 'vue-component-type-helpers'
 import { createInstance } from './createInstance'
-import { MountingOptions } from './types'
+import type { MountingOptions } from './types'
 import { trackInstance } from './utils/autoUnmount'
-import { VueWrapper } from './vueWrapper'
+import type { VueWrapper } from './vueWrapper'
 import { createVueWrapper } from './wrapperFactory'
 
 type ShimSlotReturnType<T> = T extends (...args: infer P) => any