TypeScript v5から導入されたverbatimModuleSyntaxをtrueにすると型定義を普通にimportするとエラーになります。
TypeScript 5.0 introduces a new option called --verbatimModuleSyntax to simplify the situation. The rules are much simpler - any imports or exports without a type modifier are left around. Anything that uses the type modifier is dropped entirely. https://www.typescriptlang.org/tsconfig#verbatimModuleSyntax
ただいずれは導入したい場合に新規のコードの発生を防いだり、既存コードの利用箇所を特定するために漸進的に乗り換えるために静的解析で検知してエラーに出来ないかなぁと思ったら、まさになルールがあったのでメモ📝
以下のようなコードでOptionsTypeは型定義でしか使ってない場合にエラーにしてくれます。
import { zxcvbn, zxcvbnOptions, OptionsType } from "@zxcvbn-ts/core"; // -> Import "OptionsType" is only used as types.eslint@typescript-eslint/consistent-type-imports
Auto fixにも対応していて
- import { zxcvbn, zxcvbnOptions, OptionsType } from "@zxcvbn-ts/core"; + import type { OptionsType } from "@zxcvbn-ts/core"; + import { zxcvbn, zxcvbnOptions } from "@zxcvbn-ts/core";
fixStyleを指定するとinlineでtypeを付与する事もできる🙌
// "@typescript-eslint/consistent-type-imports": ["error", { fixStyle: "inline-type-imports" }],
- import { zxcvbn, zxcvbnOptions, OptionsType } from "@zxcvbn-ts/core";
+ import { zxcvbn, zxcvbnOptions, type OptionsType } from "@zxcvbn-ts/core";
verbatimModuleSyntaxを有効化したい場合にAuto Fixしてからやるとスムーズに出来そうですね 👍
