JavaScript開発者必見！ESLintのルールを特定の行で無効にする方法

2024-04-02

特定の行のESLintルールを無効にする

ESLintは、JavaScriptコードの静的解析ツールとして広く利用されています。コードの品質向上に役立ちますが、場合によっては特定の行でルールを無効にする必要が生じます。

方法

ESLintのルールを特定の行で無効にする方法は、主に以下の3つです。

コメントによる無効化

該当行に以下のコメントを記述することで、その行のみESLintのチェックを無効にすることができます。

// eslint-disable-line

eslint-disable プラグインを使用すると、特定の行やブロック、ファイル全体でESLintルールを無効にすることができます。

例：特定の行を無効にする

// eslint-disable next-line
console.log('This is a warning.');

.eslintrc ファイルで rules プロパティを設定することで、特定のルールの動作をカスタマイズできます。

例：no-console ルールを特定の行で無効にする

{
  "rules": {
    "no-console": {
      "allow": ["warn"]
    }
  }
}

上記の設定により、console.log などのコンソール出力を警告のみで許可し、エラーとして扱わなくなります。

注意点

特定の行でルールを無効にすることは、コードの品質を低下させる可能性があります。必要最小限に留め、慎重に使用しましょう。
無効化の理由をコメントに残しておくと、コードレビュー時に理解しやすくなります。

関連技術

JavaScript
JSHint

上記の情報は、2024年3月17日時点でのものです。

// 標準のESLintルールで警告を出力するコード
console.log('This is a warning.');

// eslint-disable-line
// 上記の行のみESLintチェックを無効化

// 警告を出力しないコード
console.log('This is not a warning.');

eslint-disable プラグインの使用

// eslint-disable-next-line
console.log('This is a warning.'); // eslint-disable-line を使用して特定の行を無効化

// eslint-disable-block
// ここから...
console.log('This is also a warning.');
console.log('And this.');
// ...ここまでESLintチェックを無効化
// eslint-enable-block

// 警告を出力しないコード
console.log('This is not a warning.');

.eslintrc ファイルの設定

// 標準のESLintルールで警告を出力するコード
console.log('This is a warning.');

// .eslintrc ファイル
{
  "rules": {
    "no-console": {
      "allow": ["warn"]
    }
  }
}

// 警告を出力しないコード
console.log('This is not a warning.'); // .eslintrc で設定により無効化

上記は、ESLintルールを特定の行で無効にする方法のサンプルコードです。ご自身の状況に合わせて、適切な方法を選択してください。

特定の行のESLintルールを無効にするその他の方法

eslint-disable-line コメントにオプションを指定することで、より細かい制御が可能です。

// eslint-disable-line no-console
console.log('This is not a warning.');

eslint-comments プラグインを使用すると、コメントでESLintルールの設定を指定することができます。

例：eslint-disable コメントの代わりにeslint-disable-line コメントを使用する

// eslint-disable-line
console.log('This is not a warning.');

// eslint-comments プラグインを使用
// eslint-disable-line no-console
console.log('This is also not a warning.');

.eslintignore ファイルに特定のファイルや行を指定することで、ESLintのチェック対象から除外することができます。

例：test.js ファイルのすべての行をESLintチェック対象から除外する