next lint は lint 対象のディレクトリが制限されている

ということに next lint を触っていて気づきました。公式ドキュメントにもそう書いてありました。

next lint runs ESLint for all files in the pages, components, and lib directories. It also provides a guided setup to install any required dependencies if ESLint is not already configured in your application.

(https://nextjs.org/docs/api-reference/cli#lint より引用)

これによると、next lint は pages/, components/, lib/、そして上記ドキュメントでは漏れてますが src/ *1 を加えた 4 つのディレクトリが lint 対象となるようです。

これ以外のディレクトリを lint 対象に含めたい場合は、next lint --dir util/ のようにコマンドラインから渡すか、next.config.js の eslint.dirs オプションにディレクトリを指定するよう案内されてます。

暗黙的に lint 対象を制限することの是非

実際のところこの挙動って嬉しいんでしょうかね。本当は util/ も lint されて欲しいのに何故か lint されなくて混乱する、みたいなことが直感的には起きそうな気がします。加えて vscode-eslint (ESLint の VSCode 拡張機能) は「4つのディレクトリ以外は lint 対象から外す」ことを知らないので、util/ 配下のファイルでも ESLint の警告を出してしまいます。エディタ上で見たときと、next lint で見たときで警告の内容に違いが出るので、これも混乱しそうです。

以上のような問題があるので、除外するファイルは .eslintignore に書きつつ、eslint . でカレントディレクトリ配下のファイル全てを lint 対象にするアプローチが id:mizdra は好きです。どのディレクトリが除外されるか明示的になりますし、vscode-eslint が .eslintignore を見て、どのファイルが lint 対象外か認識してくれるので、エディタ上/CLI上での警告に差がなくなります。

zenn.dev

まあでも予想外に lint 対象の範囲が広がるのを避けたいとか、ファイルが多くなりすぎて lint 速度が低下するのを避けたいみたいな事情があったりするのかな...? いやでも速度が問題になってから .eslintignore すれば良いような気も…

next lint の初期の PR のやり取りを見ると、Next.js アプリケーションで一般的なディレクトリに限って lint するという前提で最初から設計されているように見えるので、あまりそのあたりの拘りがないのかもしれません。

https://github.com/vercel/next.js/pull/25064#discussion_r642872904

という訳で id:mizdra は以下のように、カレントディレクトリ配下のうち .eslintignore に含まれるものを除外したファイルを lint 対象とするアプローチが良いかなと思っています。

// package.json
{
  "scripts": {
    "lint": "next lint -d ."
  }
}

それよりも

デフォルトの lint 対象ディレクトリのうち、pages/, components/, src/ は順当だと思ったのですが、lib/ がそこに入っていたのはちょっとびっくりしました。Next.js 公式的には lib/ も「Next.js アプリケーションで一般的に見られるディレクトリ」ということなんですかね。id:mizdra はあんまりそういう印象なかったので「そうなの...?」となってます。公式ドキュメントでも lib/ が登場するのは next lint 関連での文脈でしかなさそうでした。

しかし Next.js の公式 Example 集を見ると、結構 lib/ が使われてるようでした。

公式ドキュメントでは触れられてないものの、公式 Example 集では使われているディレクトリみたいですね。