できない.dev

ESLint Flat Config で @typescript-eslint/parser が読み込めない

ESLint v9 の Flat Config では parser の指定方法が変わり、typescript-eslint パッケージから parser オブジェクトを受け取って languageOptions.parser に渡す必要がある。
文字列指定は使えない。

公開: 更新:

要約

ESLint v9 系の Flat Config では、TypeScript 用パーサーを文字列名で指定する旧 .eslintrc の書き方は通用しない。typescript-eslint メタパッケージから parser を import し、languageOptions.parser に実体(モジュール)を渡すのが唯一の正しい方法。
エラーは Parsing error: ... was tried to load via ...ESLint couldn't determine the plugin '@typescript-eslint' uniquely の形で出る。

よくある原因

  1. .eslintrcparser: '@typescript-eslint/parser'eslint.config.js にコピペしている
  2. @typescript-eslint/parser@typescript-eslint/eslint-plugin を個別に扱い、推奨のメタパッケージ typescript-eslint を経由していない
  3. parser の置き場所を parserOptions の下にしている(Flat Config では languageOptions.parser
  4. ESM / CJS 出力差で parser モジュールが default キー越しに入っているのを直接渡している

解決策

1. typescript-eslint を導入する

typescript-eslint 公式ドキュメント(新しいタブで開く) が推奨するメタパッケージを使う:

npm install --save-dev typescript-eslint

2. tseslint.config() で組み立てる

// eslint.config.js
import eslint from "@eslint/js";
import tseslint from "typescript-eslint";
 
export default tseslint.config(
  eslint.configs.recommended,
  ...tseslint.configs.recommended,
  {
    languageOptions: {
      parserOptions: {
        project: "./tsconfig.json",
        tsconfigRootDir: import.meta.dirname,
      },
    },
  },
);

tseslint.config は内部で parser をオブジェクトとして組み立ててくれるので、書き手は文字列名を意識する必要がない。

3. 直書きする場合は parser を実体で渡す

import tsParser from "@typescript-eslint/parser";
 
export default [
  {
    files: ["**/*.ts", "**/*.tsx"],
    languageOptions: {
      parser: tsParser,
      parserOptions: { project: "./tsconfig.json" },
    },
  },
];

文字列 "@typescript-eslint/parser" を渡すと parser is not a function 等で失敗する。

4. 旧 .eslintrc.* を撤去する

ESLint v9 は既定で .eslintrc.* を読まないが、ESLINT_USE_FLAT_CONFIG=false 等で互換モードに落ちていると新旧が混じってデバッグが難しくなる。
移行が完了した時点で旧設定ファイル・.eslintignore をすべて削除する。ignores は新 eslint.config.js の中に書き直す。

実行例

実際に上記の手順を node:20 環境で動かすと、parser 未指定の Flat Config では Parsing error: Unexpected token : が発生して終了コード 1 となり、languageOptions.parser に typescript-eslint のパーサーを渡すことで終了コード 0 に切り替わることが確認できる。
なお、この Unexpected token : は parser をまったく設定していない場合の現れ方であり、本文冒頭で挙げた ... was tried to load via ...ESLint couldn't determine the plugin '@typescript-eslint' uniquely はプラグイン・parser の解決に失敗した場合に出る別バリアントだが、いずれも languageOptions.parser に実体を渡す同じ修正で解消する。

v9.39.5
$ npx eslint sample.ts
/tmp/tmp.FhA0YoczwA/sample.ts
  1:8  error  Parsing error: Unexpected token :
 
✖ 1 problem (1 error, 0 warnings)
 
eslint の終了コード: 1
$ npx eslint sample.ts
eslint の終了コード: 0(0 = パースできた)

— 2026-08-02 時点の出力

この記事は役立ちましたか?