ESLintでconsoleの使用をエラーにする

こんにちは。サービス開発室の武田です。

先日CDKのソースコードをレビューしていたところ、動作確認用のconsole.logが残っていました。grepなどで探すのは面倒ですので、Linterにお任せしましょう。

no-consoleルール

ESLintに用意されているno-consoleルールを有効にすることでチェックされます。

有効化は簡単で、.eslintrs.jsなどの設定ファイルに'no-console': 'error'を追記するだけです。

.eslintrc.js

module.exports = {
  // 省略
  rules: {
    // 省略
    'no-console': 'error',
  },
};

また、consoleであっても、warnとerrorだけは使ってもOKとした場合には、次のように書けます。

.eslintrc.js

module.exports = {
  // 省略
  rules: {
    // 省略
    'no-console': ['error', { allow: ['warn', 'error'] }]
  },
};

チェックしてみた

設定を追記し、実際にLinterを走らせてみました。

$ npx eslint **/*.ts

/work_dir/hogehoge.ts
  12:5  error  Unexpected console statement  no-console

✖ 1 problem (1 error, 0 warnings)

$ sed -n 12p hogehoge.ts
    console.log(__dirname);

このプロジェクトでは一行のみ使用している箇所があったようです。

まとめ

JSやTSのコードをデバッグする際に、console.logを書くことはよくあります。しかしそのまま残しておくのはあまりよろしくありませんね。必要ないのであれば、Lintの設定をして簡単に見つけられるようにしておくと良さそうです。