Prettier est linter, un outil dont le rôle est de formatter le code source toujours de la même façon, suivant les règles de sa configuration. Dans un projet à auteurs multiples, c’est vraiment indispensable pour éviter les engueulades lors des codes reviews, mais même quand on travaille seul, mettre en forme selon la seule humeur du jour, ça perturbe la lecture quand il s’agit de reprendre un code quelques semaines plus tard.

Installer Prettier

Pour ajouter Prettier à votre projet, utilisez

npm install --save-dev --save-exact prettier

(plus d’informations sur Gérer les dépendances avec NPM)

Attention, ici, il faut utiliser —save-exact pour fixer la version de Prettier parce que les recommandations par défaut évoluent avec les versions.

Configurer Prettier

Pour configurer les règles Prettier de votre projet, vous devrez créer un fichier .prettierrc à la racine de votre projet. Ces règles sont parfaitement subjectives, donc utilisez ce qui vous correspond le mieux pour vous, votre équipe et/ou votre projet. A pur titre d’information, donc, voici les règles de LeCoinDuProf :

{
 "printWidth": 120,
 "singleQuote": true,
 "useTabs": false,
 "tabWidth": 2,
 "semi": true,
 "bracketSpacing": true
}

Prettier et angular

Une petite subtilité concerne les projets Angular puisque ceux-ci utilisent déjà tslint, et les deux linters peuvent entrer en conflit. Pensez donc à modifier votre fichier tslint.json pour y supprimer les règles en doublon.

Vous pourrez trouver les modifications apportées à LeCoinDuProf à l’installation de Prettier dans le commit suivant https://github.com/AlanCrevon/LeCoinDuProf/commit/2b505336a0632f67f3a400bc864d6755fa9a8955