ESLint + Prettier をセットアップするといつも苦しむからちゃんと理解する (2020年10月版) - Qiita

前置き JavaScript/TypeScript の開発環境を整えるとき、当然 Lint や Formatter はしっかりとセットアップしておきたいです。最近の主流では ESLint + Prettier の構成をとると思いますが、使用するライブラリが多くてなにかと変化も激しいため、いつも設定に苦しみます。 そこで、それぞれのライブラリの役割を理解しながら、基本の構成を整理していきます。 想定プロジェクト Webフロントエンドを TypeScript + React で開発する想定でいきます。 (一番よくやるので。) エディタは VSCode を使用し、ファイル保存時に自動整形されるようにします。 TL;DR eslint-config-prettier だけ使っとけ。 1. ESLint をインストールする 以下のコマンドで主役の ESLint を導入します。 (yarn ユーザは適