@typescript-eslint/consistent-type-definitionsとは
TypeScript コードにおいてinterfaceおよびtypeの型定義の一貫性を保つためのESLint ルールです。
このルールを使用することで、プロジェクト内の型定義に対して統一されたスタイルを強制することができます。
ESLintの設定ファイル (例: .eslintrc.cjs) に以下のようにルールを追加すれば使用可能になります。
typeで統一したい場合は ['error', 'type'] 、interfaceで統一したい場合は ['error', 'interface'] になります。
※ 'type' と 'interface' のどちらも未設定だと 'interface' がデフォルト設定になります。
.eslintrc.cjs
{
'rules': {
'@typescript-eslint/consistent-type-definitions': ['error', 'type']
}
}['error', 'type'] を設定している場合、VS Codeだと画面上のコード内にtypeとinterfaceがあると、interfaceの方に警告が表示されます。
自動修正が設定されている状態で上書き保存すると自動的に「interface Bar {}」を「type Bar = {}」に変更することができます。
TypeScript
type Foo = {
email: string
}
type Bar = {
age: number
}
type Baz = Foo & Bar
const data: Baz = {
email: 'example@gmail.com',
age: 34
}
console.log(data)※ interfaceのextendsなどは上書き保存しても自動的に書き換わりません
typeとinterfaceのどちらに統一するべきか
typeとinterfaceのどちらに統一するかは、既存のプロジェクトのルールに従い、特に決まっていない場合は以下の理由により、typeで統一することを推奨します。
typeのメリット
- 短くてtypoが少なく見やすい
- 名前が重複すると警告が表示される
- 「&」で型を統合できて再利用しやすい
- 条件付き型 (Conditional Type)が使用できる
- 「type Num = 1 | 2 | 3」のようなユニオン型を作れる
