[ESLint] Unexpected console statement (no-console) at xxxxx というエラーを非表示にする方法

ESLintでコードのチェックをしたら、console.logメソッドを呼び出している箇所でタイトルのようなエラーが表示された。

ESLintの公式ドキュメントには、だいたい次のようなことが書いてある。

「ブラウザ用アプリでは、ブラウザのコンソールに表示する文字列ってだいたいデバッグ用でしょ？そんなものはユーザーの目に留まるところに表示しちゃダメだよ。消すべし」

Node.jsを使って開発している場合などで、もしもこのエラーを表示させたくない場合は次のいずれかの方法でできる。

console呼び出し箇所ごとに設定する

次のように、コンソール出力をしている行の直前におまじないのコメントを追加する。

// eslint-disable-next-line no-console
console.log("うんたらかんたら");

コンソール出力箇所が少ないアプリならこれで事足りるけど、何箇所もあって鬱陶しいときは次のようにアプリで一括で設定しよう。

アプリで一括で設定する

package.jsonと同階層のフォルダにある.eslintrc.jsで次のように設定を追加すると、通常のコンソール出力ではエラーを表示せず、console呼び出しの文法に誤りがある場合にのみエラーを表示してくれるようになる。

module.exports = {

  // 略

  rules: {
    "no-console": "off",
    "no-restricted-syntax": [
            "error",
            {
                "selector": "CallExpression[callee.object.name='console'][callee.property.name!=/^(log|warn|error|info|trace)$/]",
                "message": "Unexpected property on console object was called"
            }
        ]
  }
};