メインコンテンツへスキップ

トリプルスラッシュ参照

ES6形式のimport宣言を推奨し、特定のトリプルスラッシュディレクティブを禁止します。

✅

拡張 "plugin:@typescript-eslint/recommended" を ESLint構成 で有効にすると、このルールが有効になります。

TypeScriptの /// トリプルスラッシュ参照は、別のモジュールの型がファイル内で利用可能であることを示す方法です。トリプルスラッシュ参照の型ディレクティブの使用は、一般的に ECMAScript モジュールの import を推奨します。このルールは、/// <reference lib="..." />、/// <reference path="..." />、または /// <reference types="..." /> ディレクティブの使用をレポートします。

.eslintrc.cjs
module.exports = {
  "rules": {
    "@typescript-eslint/triple-slash-reference": "error"
  }
};

プレイグラウンドでこのルールを試す ↗

オプション​

このルールは次のオプションを受け入れます

type Options = [
  {
    lib?: 'always' | 'never';
    path?: 'always' | 'never';
    types?: 'always' | 'never' | 'prefer-import';
  },
];

const defaultOptions: Options = [
  { lib: 'always', path: 'never', types: 'prefer-import' },
];

3種類の参照は、オプションとして任意の数を指定できます。 'always' を指定すると、その種類の参照についてはこのリンタールールが無効になります。

lib​

'never' に設定すると、/// <reference lib="..." /> が禁止され、代わりに import を使用することを強制します。

/// <reference lib="code" />

globalThis.value;
プレイグラウンドで開く

path​

'never' に設定すると、/// <reference path="..." /> が禁止され、代わりに import を使用することを強制します。

/// <reference path="code" />

globalThis.value;
プレイグラウンドで開く

types​

'never' に設定すると、/// <reference types="..." /> が禁止され、代わりに import を使用することを強制します。

/// <reference types="code" />

globalThis.value;
プレイグラウンドで開く

types オプションには、代わりに "prefer-import" 値を指定できます。これにより、同じ場所からの import が既に存在する場合にのみ、ルールがレポートするようになります。

/// <reference types="code" />

import { valueA } from 'code';

globalThis.valueB;
プレイグラウンドで開く

使用しない場合​

最近のほとんどのTypeScriptプロジェクトでは、通常、型を導入するために import ステートメントを使用します。自動生成されたコード以外で /// トリプルスラッシュ参照が必要になることはまれです。プロジェクトが、これらのユースケースのいずれかに該当するまれなケースである場合、このルールはあなたには適していないかもしれません。このルールを完全に無効にする代わりに、特定の状況については ESLint disable コメント を使用することを検討してください。

使用しない場合​

トリプルスラッシュ参照ディレクティブのすべての種類を使用したい場合。

リソース​