prettier-eslint、eslint-plugin-prettier、eslint-config-prettierの違いは何ですか？
PrettierとESLintを一緒に使用したいのですが、次々に使用するだけでいくつかの競合が発生しました。タンデムで使用できるように見えるこれらの3つのパッケージがあることがわかります。
prettier-eslinteslint-plugin-prettiereslint-config-prettier
ただし、これらのパッケージ名にはすべてeslintとprettierが含まれているため、どちらを使用するかはわかりません。
どちらを使うべきですか？
ESLintには多くのルールが含まれており、フォーマット関連のルールは、arrow-parens、space-before-function-parenなどのPrettierと競合する可能性があります。したがって、それらを一緒に使用するといくつかの問題が発生します。 ESLintとPrettierを一緒に使用するために、次のツールが作成されました。
Stack Overflowはテーブルのフォーマットをサポートしていないため、要点で 表形式での比較 を作成しました。あなたがより多くの組織を好むなら、それをチェックしてください。
prettier-eslint ：prettierを実行してから、コードに対してeslint --fixを実行します。 eslintには通常、フォーマット関連のルールの自動修正があり、eslint --fixはPrettierによって導入された競合するフォーマットを修正できます。 prettierコマンドを個別に実行する必要はありません。
eslint-plugin-prettier ：これはESLintプラグインです。つまり、ESLintがチェックする追加ルールの実装が含まれています。このプラグインは内部でPrettierを使用し、コードがPrettierの予想出力と異なる場合に問題が発生します。これらの問題は、--fixを介して自動的に修正できます。このプラグインを使用すると、prettierコマンドを個別に実行する必要はありません。コマンドはプラグインの一部として実行されます。このプラグインはフォーマット関連のルールをオフにしません。手動で、またはeslint-config-prettierを介してこのようなルールの競合が発生した場合は、オフにする必要があります。
eslint-config-prettier ：これはESLint構成であり、ルールの構成が含まれています（特定のルールがオン、オフ、または特別な構成であるかどうか）。この構成では、Prettierと競合する可能性のあるフォーマット関連のルールをオフにすることで、 eslint-config-airbnb などの他のESLint構成でPrettierを使用できます。この構成では、Prettierがコードをフォーマットした後にESLintが文句を言わないので、prettier-eslintを使用する必要はありません。ただし、prettierコマンドを個別に実行する必要があります。
これが違いをまとめることを願っています。
更新：prettier-eslintは推奨されなくなり、eslint-plugin-prettierとeslint-config-prettierを一緒に使用できます。