Une équipe de quatre personnes produit quatre styles d'indentation, deux conventions de guillemets et un désaccord durable sur les points-virgules. Chaque relecture se transforme en discussion sur la forme plutôt que sur le fond.
Prettier tranche le débat en retirant le sujet à tout le monde : personne ne décide plus de la mise en forme, l'outil s'en charge.
Définition
Prettier est un formateur de code : il analyse un fichier, oublie complètement la mise en forme d'origine et la réécrit selon ses propres règles. Le comportement du programme n'est jamais modifié, seule son apparence l'est. Ses réglages tiennent dans un fichier dédié ou dans une clé du package.json.
// prettier.config.js
export default {
semi: true,
singleQuote: true,
printWidth: 100,
trailingComma: 'all',
};
// Avant
const panier = {articles:2, total:98,
paye : false}
// Après
const panier = { articles: 2, total: 98, paye: false };La largeur de ligne est le réglage le plus structurant : c'est lui qui décide si un appel tient sur une ligne ou se répartit sur plusieurs. Les options réglables sont volontairement peu nombreuses, pour limiter la surface de discussion.
Ce qu'il décide à votre place
| Réglage | Valeur par défaut |
|---|---|
printWidth | 80 caractères |
tabWidth | 2 espaces |
semi | Points-virgules ajoutés |
singleQuote | Guillemets doubles |
Une vingtaine de réglages existent en tout, et le gros du rendu leur échappe volontairement. La position d'une accolade ou la façon dont une longue expression se coupe ne se règlent pas : elles se subissent, ce qui fait gagner un temps considérable.
L'effet le plus utile se voit dans l'historique du projet. Une mise en forme stable produit des différences de version qui ne contiennent que les modifications réelles, au lieu de deux cents lignes réindentées par un éditeur.
Avec ESLint, pas contre lui
Les deux outils ne font pas le même travail : ESLint juge la qualité du code, Prettier son apparence. La confusion vient des anciennes règles de mise en forme d'ESLint, qui entraient en conflit avec le formateur.
La configuration recommandée consiste à désactiver ces règles de style dans ESLint et à laisser Prettier seul maître de la forme. Chacun garde alors son terrain, et un enregistrement ne déclenche plus deux corrections contradictoires.
Questions fréquentes
Comment l'appliquer à tout un projet existant ?
La commande prettier --write ., lancée par npx ou par un script, reformate l'ensemble des fichiers d'un coup. Faites-en une modification isolée, sans aucun changement de comportement : la relecture reste possible, et l'historique garde une frontière nette entre le reformatage et le travail réel.
Peut-on lui échapper sur un passage précis ?
Oui, avec un commentaire // prettier-ignore placé juste avant. C'est utile pour un tableau de données aligné à la main, ou une matrice dont la disposition porte du sens. Un fichier .prettierignore permet d'exclure des dossiers entiers, comme le résultat d'un build.
Quand faut-il le lancer ?
À l'enregistrement du fichier, via votre éditeur, ce qui rend l'outil invisible au quotidien. Sur un projet à plusieurs, une vérification supplémentaire avant chaque envoi garantit que rien n'échappe à la règle, même depuis une machine mal configurée.