useImportType

诊断类别：lint/style/useImportType

¥Diagnostic Category: lint/style/useImportType

TypeScript and TSX

自从：v1.5.0

¥Since: v1.5.0

来源：

¥Sources:

灵感来自：@typescript-eslint/consistent-type-imports

¥Inspired from: @typescript-eslint/consistent-type-imports

提倡使用 import type 作为类型。

¥Promotes the use of import type for types.

TypeScript 允许在 import 上指定 type 限定符，以指示 import 在运行时不存在。这允许转译器安全地删除类型的导入而无需查找其定义。这还确保某些模块不会在运行时加载。

¥TypeScript allows specifying a type qualifier on an import to indicate that the import doesn’t exist at runtime. This allows transpilers to safely drop imports of types without looking for their definition. This also ensures that some modules are not loaded at runtime.

该规则确保所有仅用作类型的导入都使用仅类型的 import。它还将内联类型导入分组到分组的 import type 中。

¥The rule ensures that all imports used only as a type use a type-only import. It also groups inline type imports into a grouped import type.

如果你使用 TypeScript 编译器 (TSC) 将代码编译为 JavaScript，则可以禁用此规则，因为 TSC 可以删除仅用作类型的导入。但是，为了与其他转译器保持一致性和兼容性，你可能需要启用此规则。在这种情况下，我们建议启用 TSC 的 verbatimModuleSyntax。此配置确保 TSC 保留未用 type 限定符标记的导入。

¥If you use the TypeScript Compiler (TSC) to compile your code into JavaScript, then you can disable this rule, as TSC can remove imports only used as types. However, for consistency and compatibility with other transpilers, you may want to enable this rule. In that case we recommend to enable TSC’s verbatimModuleSyntax. This configuration ensures that TSC preserves imports not marked with the type qualifier.

你可能还想从 TypeScript LSP 启用编辑器设置 typescript.preferences.preferTypeOnlyAutoImports。此设置在 Visual Studio Code 中可用。它确保在编辑器自动导入类型时使用 type。

¥You may also want to enable the editor setting typescript.preferences.preferTypeOnlyAutoImports from the TypeScript LSP. This setting is available in Visual Studio Code. It ensures the type is used when the editor automatically imports a type.

TypeScript 实验性装饰器的注意事项

¥Caveat with TypeScript experimental decorators

某些框架（如 Angular 和 NestJS）依赖于实验性 TypeScript 装饰器，允许根据类型注释生成代码。这主要用于依赖注入。

¥Some frameworks like Angular and NestJS rely on experimental TypeScript decorators which allow code to be generated based on type annotations. This is mainly used for dependency injection.

由于 Biome 不知道装饰器是如何实现的，因此无法检测到用作类型的导入在装饰器生成的代码中也用作值。这导致 Biome 建议将一些导入作为类型导入，这些导入实际上在运行时用作值。

¥Since Biome doesn’t know how a decorator is implemented, it is unable to detect that an import used as a type is also used as a value in the code generated by a decorator. This leads Biome to suggest importing some imports as type, which are actually used as value at runtime.

我们尚未找到支持此模式的方法。我们建议在使用此类装饰器时禁用此规则。

¥We haven’t found a way to support this pattern yet. We recommend disabling this rule when using such decorators.

选项

¥Options

此规则尊重 jsxRuntime 设置，如果设置为 "reactClassic"，则会对 React 全局变量进行例外处理。

¥This rule respects the jsxRuntime setting and will make an exception for React globals if it is set to "reactClassic".

示例

¥Examples

无效

¥Invalid

import { A } from "./mod.js";
type TypeOfA = typeof A;
let a: A;

code-block.ts:1:1 lint/style/useImportType  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ All these imports are only used as types.
  
  > 1 │ import { A } from “./mod.js”;
      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 │ type TypeOfA = typeof A;
    3 │ let a: A;
  
  ℹ Importing the types with import type ensures that they are removed by the transpilers and avoids loading unnecessary modules.
  
  ℹ Safe fix: Use import type.
  
    1 │ import·type·{·A·}·from·“./mod.js”;
      │        +++++

import { type A, type B } from "./mod.js";

code-block.ts:1:1 lint/style/useImportType  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ All these imports are only used as types.
  
  > 1 │ import { type A, type B } from “./mod.js”;
      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 │ 
  
  ℹ Importing the types with import type ensures that they are removed by the transpilers and avoids loading unnecessary modules.
  
  ℹ Safe fix: Use import type.
  
    1   │ - import·{·type·A,·type·B·}·from·“./mod.js”;
      1 │ + import·type·{·A,·B·}·from·“./mod.js”;
    2 2 │

import { type A, B } from "./mod.js";
let c: A;
let d: typeof B;

code-block.ts:1:1 lint/style/useImportType  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ All these imports are only used as types.
  
  > 1 │ import { type A, B } from “./mod.js”;
      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 │ let c: A;
    3 │ let d: typeof B;
  
  ℹ Importing the types with import type ensures that they are removed by the transpilers and avoids loading unnecessary modules.
  
  ℹ Safe fix: Use import type.
  
    1   │ - import·{·type·A,·B·}·from·“./mod.js”;
      1 │ + import·type·{·A,·B·}·from·“./mod.js”;
    2 2 │   let c: A;
    3 3 │   let d: typeof B;

有效

¥Valid

import type { A } from "./mod.js";
let a: A;

import { B } from "./mod.js";
let a: B = new B();

import { type A, B } from "./mod.js";
let c: A;
let d = new B();

该规则忽略未使用的导入和具有导入属性的导入。

¥The rule ignores unused imports and imports with import attributes.

import { A } from "./mod.js";

import { B } from "./mod.js" with {};
export type { B };

useImportType

TypeScript 实验性装饰器的注意事项

选项

示例

无效

有效

相关链接