特定の行でESLintのチェックを無効にしたい場合の対処方法

ESLintを導入してる場合、__no-unused-vars__ルールの設定によっては、宣言してるけれど、利用してない不要な変数に対して、警告表示してくれる。

しかし、以下のようなケースでも警告してくるのは、ちょっと鬱陶しい場合があります。

no-unused-vars

その場合、2通りの対処方法があります。 一つは、__// eslint-disable-line__をチェック無効にしたい行の末尾に追記することです。

特定の行のみ

import React, { FC } from 'react'; // eslint-disable-line
import './App.css';

特定のルールのみ無効にしたい場合は、__eslint-disable-lineの後ろに__特定のルールを記述することで、特定のルールのみ無効にすることも可能です。

// eslint-disable-line no-unused-vars

複数行に対して

複数行の場合は、以下事例に示す通りです。 __/* eslint-disable */__で囲まれた行がESLintチェックの対象外となります。

/* eslint-disable */
import React, { FC } from 'react'; // eslint-disable-line
import './App.css';
/* eslint-enable */

他の対処方法として、__eslintrc.js__のrulesに以下の記述を追加することで無効に出来ますが、チェックして欲しい行に対しても、無効化されるので、上記方法を検討した方が良いと思います。

  rules: {
    'no-use-before-define': 'off',
    '@typescript-eslint/no-use-before-define': ['error', {variables: false}],