😖

ESLint と Prettier について

2021/03/22に公開

他の方のコメント欄で書こうとしたのですが、長くなったので記事にします。

プロジェクトでよく使われている

開発の思想もなにもなく「単によく使われているから」という理由で、ESLint と それと組み合わされて Prettier が使われているプロジェクトをみかけます。少し残念です。

調べてみると「今どきPrettierを入れない理由がない」とか書いてあるページも見つかります。やれやれ。

ESLint 最高!

ESLintは様々な設定を切り替えられるので、プロが使うとてもよいツールに思います。ESLint -fix オプションにはとてもお世話になりますし、warn や error などで警告レベルを変えられるのもよく出来ています。

あれだけのオプションで正確な構文解析を行っているので prettier レベルの整形をしようとおもえばできるけれども、そこまでやると変なことも多いからあえてやらない、というプロ向けツールのこだわりをヒシヒシ感じます。

Prettierは...

対して、Prettierは整形度合いが派手で目立つものの、変な整形をしてしまうときが多く、設定で個別にON/OFFにできることが少なくて、変な整形部分を解除できないので、かなり使いづらいツールと感じています。

関数名や変数名の単なる数文字の長さの違いによって、ある所は改行されてたり、あるところは改行されなかったりしてしまい、「同じような処理は同じように書かれているべきである。コードの影が一致しておくべき」という書籍リーダブルコードにも書かれている指針にあわせることが無理になってしまいます。

初心者には「めちゃくちゃ自動整形されてすごーい」と見えるのですが、こだわりをもって読みやすいコードを書くプロには使ってほしくないツールだなと思い、この記事書いています。

必須と補助的なもの

これは、eslintとprettierだけには限らないことですが、

必須のツールと補佐的なツールでは必須のツールの機能が強化されると補佐的なツールは不要になってしまいます。

eslint -fix の整形機能がより強くなれば prettier は不要となるツール、なので、prettier の設定とか使い方とか覚える気にならないです。

npm の高速化版として登場している yarn なんかも、npmが高速になれば不要になるので yarnのコマンド体系とかもわざわざ覚えたくないのです。npm だけが必須ツールとして存在してくれればいいので。yarnが高速だからyarnを使うと考えている人がいたら、もう少し先の事を考えていただきたいのです。

かつて、gulp や grunt といったタスクランナーというツールが流行った時がありました。1~3年間くらいでしたでしょうか。その流行はあっという間になくなり、今では既存のプロジェクトを引き継いでいない限りはおそらくgulp や grunt は使われていないでしょう。npmでscriptを書けばそれらの「タスクランナー」という物自体がいらないのではないか、と多くの人が気がついたから流行は過ぎ去りました。必須ではなく補佐的なツールだったんです。今ではgulp や grunt というツールのためのコードはメンテしにくい技術的負債になってしまっています。gulp や grunt のプラグインを作成するのに情熱を傾けていた開発者たちには、ほんと寂しさを感じてしまったりします。

prettierはそういう将来的にツールの寿命を考えたときにメリットあるものなのだろうかと思うという考慮もあり、自分は使うのをさけています。

先を見通した上での技術選定を行う方がよいです。

連携プラグインについて

eslintとprettierだけには限らないことについての、もうひとつのツールの使い方のコツについて知っておくべきことがあります。(webpack と babel の関係でも同じような問題があります)

eslint - pretter を連携させるプラグインなどは、eslint が単体で verup また、pretter が単体で verup したときに、単体ならどちらも正常に動くのに eslint-prettierのプラグインがどちらかのバージョンアップに追随できなくなって動かなくなってしまいプロジェクト全体で困ったことがおきるので、それゆえに、eslint も prettier もどちらもバージョンがあげられない、という謎の苦しみを生む場合があります。

なので、ツールAと、ツールB、とを接続する、プラグインABというものは、その場限りでは役立つように思いますが、プロジェクトに採用するには将来的なリスクが大きすぎる足かせになるので使用に気をつけなければいけません。

使うとしても ESLint と Prettier はプラグインなどと連携して使うんじゃなくて単体で設定をいろいろ考慮しながら使うほうが安定して長く使える可能性があがります。

Prettier を、もし使うなら、バージョンアップ時のトラブルとかの想定もお気をつけください。

私は ESLint だけでシンプルで行きます。そうするとトラブルも再設定も考える必要なく単体でverup 可能で比較的安全です。

そんな感じです。

参照

eslint-plugin-prettier を ESLint から 分離するサンプル – Intellij IDEA の設定変更も | DevelopersIO
https://dev.classmethod.jp/articles/eslint-and-prettier/
あ、やっぱり...去年末の記事ですか、そうですかそうですか。

[意訳]私がGulpとGruntを手放した理由 - Qiita
https://qiita.com/chuck0523/items/dafdbd19c12efd40e2de

Discussion