【解決済み】eslint-plugin-importがTypeScript環境で動かないことがある件について
追記(2024/1/29)
この記事で取り上げた問題ですが、v2.29.1で解消されていることを確認しました。コメントで指摘してくださりありがとうございました。
概要
TypeScriptのプロジェクトでESLintを使いつつ、import文の並び順チェックなどを可能にするESLintのプラグインであるeslint-plugin-importを使おうとしたとき、次のようなエラーが発生しました。
$ pnpm eslint ./src/main.ts
Oops! Something went wrong! :(
ESLint: 8.45.0
TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received an instance of Array
Occurred while linting /path/to/project/src/main.ts:1
Rule: "import/namespace"
# 以下スタックトレース
原因
eslint-plugin-importがtsconfig.jsonを読み込むために使用しているtsconfig-pathsは3.14.2と古く、最新のtsconfig.jsonを解釈できません。上記エラーは、extendsとして文字列ではなく文字列の配列を定義しているtsconfig.jsonを使用したために発生しました。
// tsconfig.json
{
"extends": [
"@tsconfig/strictest/tsconfig.json",
"@tsconfig/node18/tsconfig.json"
]
}
対処方法
この問題はすでに報告されているため修正待ち……なのですが、そう簡単な話ではないようです。
私が上記Issue及びPRをざっくりと読んだところ、どうやらtsconfig-pathsのバージョンアップに伴うNode.js v4のサポート終了がeslint-plugin-importにとってうれしくないようで、バックポートうんぬん……という話になっているようでした。すでにEOLから長い時間が経過しているNode.js v4をサポートし続けるためにこの問題の修正が遅れているような状況だと思われます(が、悪い方向に加熱した議論をわざわざ追えるほどの元気が私にはないので申し訳ありませんが詳しい話はわかりません)。
簡単にできる対処方法として、tsconfig-pathsを使わないeslint-plugin-importフォークであるeslint-plugin-iを使うというものがあります。
このフォークは、単純にeslint-plugin-importを置き換えるだけで問題なく使えます。
$ pnpm add -D eslint-plugin-import@npm:eslint-plugin-i@latest
おわりに
慣れないESLintの設定で何かミスをしてしまったのかと誤解して、原因究明に無駄に時間がかかってしまいました。結局のところ明らかになった「原因」も嫌に面倒なものだったので楽しくありません。とりあえずこの問題についての日本語情報として、こうして記事に残しておくことにします。
Discussion
2023/11/28時点でまだ解決しておらず、未だに再現していました。
↑のIssueのコメントに書かれていますが、package.jsonに
overridesを追記して、依存しているtsconfig-pathsのバージョンを上書きするという方法もあるようです。6日前(2023/12/14)にリリースされたv2.29.1で解消されたようです。
tsconfig-paths がアップデートされていますが、軽く見てみたところ
"engines": { "node": ">=6" }の指定が入っている最新の 4.x ではなく、その指定がない 3.15.0 が新たにリリースされたのを取り込んだようですね。