ESLint contient de nombreuses règles et celles qui sont le formatage liés peuvent entrer en conflit avec Prettier, tels que arrow-parens
, space-before-function-paren
, etc. Par conséquent les utiliser ensemble causera des problèmes. Les outils suivants ont été créés pour utiliser ESLint et Prettier ensemble.
J'ai écrit une comparaison dans un format tabulaire dans un résumé, car Stack Overflow ne prend pas en charge le formatage de tableau. Vérifiez-le si vous préférez plus d'organisation.
prettier-eslint
: S'exécute prettier
puis s'exécute eslint --fix
sur le code. eslint
a généralement des correctifs automatiques pour le formatage des règles liées, et eslint --fix
sera en mesure de corriger le formatage conflictuel introduit par Prettier. Vous n'aurez pas besoin d'exécuter la prettier
commande séparément.
eslint-plugin-prettier
: Il s'agit d'un plugin ESLint, ce qui signifie qu'il contient l'implémentation de règles supplémentaires qu'ESLint vérifiera. Ce plugin utilise Prettier sous le capot et soulèvera des problèmes lorsque votre code diffère de la sortie attendue de Prettier. Ces problèmes peuvent être automatiquement résolus via --fix
. Avec ce plugin, vous n'avez pas besoin d'exécuter la prettier
commande séparément, la commande est exécutée dans le cadre du plugin. Ce plugin ne désactive pas les règles liées au formatage, et vous devrez les désactiver si vous voyez des conflits pour ces règles manuellement ou via eslint-config-prettier
.
eslint-config-prettier
: Il s'agit d'une configuration ESLint, et elle contient des configurations pour les règles (que certaines règles soient activées, désactivées ou des configurations spéciales). Cette configuration vous permet d'utiliser Prettier avec d'autres configurations ESLint, eslint-config-airbnb
par exemple en désactivant les règles liées au formatage qui pourraient entrer en conflit avec Prettier. Avec cette configuration, vous n'avez pas besoin de l'utiliser prettier-eslint
car ESLint ne se plaindrait pas après que Prettier formate votre code. Vous devrez cependant exécuter la prettier
commande séparément.
J'espère que cela résume les différences.
Mise à jour: Il est recommandé de laisser Prettier gérer le formatage et ESLint pour les problèmes de non-formatage, prettier-eslint
n'est pas dans la même direction que cette pratique, et prettier-eslint
n'est donc plus recommandée. Vous pouvez utiliser eslint-plugin-prettier
et eslint-config-prettier
ensemble.
eslint-config-prettier
, pourquoi avons-nous besoin de courir plus joli? Neeslint --fix
formaterait -il pas le code de la même manière qu'une plus jolie le ferait?