ESLint

ESLint とは

ESLint は、JavaScript/TypeScript のコードを静的に解析し、バグの可能性がある箇所やコーディング規約違反を検出するツールである。Nicholas C. Zakas が 2013 年に開発し、JavaScript エコシステムで最も広く使われている Linter だ。

ESLint 9 の Flat Config

ESLint 9 で設定形式が .eslintrc から eslint.config.js (Flat Config) に変更された。

// eslint.config.js
import eslint from '@eslint/js';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  eslint.configs.recommended,
  ...tseslint.configs.recommended,
  {
    rules: {
      'no-console': 'warn',
      '@typescript-eslint/no-unused-vars': 'error',
      '@typescript-eslint/no-floating-promises': 'error',
    },
  },
  { ignores: ['dist/', 'node_modules/'] },
);

重要なルール

ルール	検出する問題
no-unused-vars	未使用の変数
no-floating-promises	await されていない Promise
no-explicit-any	any 型の使用
no-non-null-assertion	! (Non-null Assertion) の使用
prefer-const	再代入されない let
eqeqeq	== の代わりに === を強制

no-floating-promises は特に重要だ。await を付け忘れた Promise は、エラーが握りつぶされるバグの原因になる。

Prettier との役割分担

ツール	役割	例
ESLint	コード品質 (バグ検出、ベストプラクティス)	未使用変数、any 型、floating promises
Prettier	コードフォーマット (見た目の統一)	インデント、セミコロン、引用符

ESLint のフォーマット系ルールは非推奨になり、フォーマットは Prettier に任せるのが現在の標準だ。

CI での実行

# GitHub Actions
- name: Lint
  run: npx eslint . --max-warnings 0

--max-warnings 0 で警告もエラーとして扱い、CI を失敗させる。警告を放置すると、いつの間にか数百件に膨れ上がる。

自動修正

npx eslint . --fix  # 自動修正可能なルールを修正

prefer-const、no-extra-semi などは自動修正できる。no-floating-promises のような論理的な問題は手動修正が必要だ。

全体像を把握するには関連書籍も有用。