Formatez votre code avec Prettier

Prettier est un formateur de code avisé. C'est un excellent moyen de garder le code formaté de manière cohérente pour vous et votre équipe, et prend en charge de nombreux langages différents prêts à l'emploi

Introduction à Prettier

Prettier est un formateur de code avisé.

Il prend en charge de nombreuses syntaxes différentes prêtes à l'emploi, notamment:

JavaScript
Couler,Manuscrit
CSS, SCSS, moins
JSX
GraphQL
JSON
Réduction

et avecpluginsvous pouvez l'utiliser pour Python, PHP, Swift, Ruby, Java et plus encore.

Il s'intègre aux éditeurs de code les plus populaires, y compris VS Code, Sublime Text, Atom et plus encore.

Prettier est extrêmement populaire, car en février 2018, il a été téléchargé plus de 3,5 millions de fois.

Les liens les plus importants dont vous avez besoin pour en savoir plus sur Prettier sont

Moins d'options

J'ai appris Go récemment et l'une des meilleures choses à propos de Go estgofmt, un outil officiel qui formate automatiquement votre code selon des normes communes.

95% (statistique constituée) du code Go a exactement la même apparence, car cet outil peut être facilement appliqué et comme le style est défini pour vous par les responsables de Go, vous êtes beaucoup plus susceptible de vous adapter à cette norme au lieu d'insister. sur votre propre style. Comme les tabulations et les espaces, ou où placer un crochet ouvrant.

Cela peut sembler une limitation, mais c'est en fait très puissant. Tous les codes Go se ressemblent.

Plus joli est legofmtpour le reste du monde.

Il a très peu d'options, etla plupart des décisions sont déjà prises pour vousafin que vous puissiez arrêter de vous disputer sur le style et les petites choses, et vous concentrer sur votre code.

Différence avec ESLint

ESLintest un linter, il ne fait pas que formater, mais il met également en évidence certaines erreurs grâce à son analyse statique du code.

C'est un outil inestimable et il peut être utilisé avec Prettier.

ESLint met également en évidence les problèmes de formatage, mais comme il est beaucoup plus configurable, tout le monde pourrait avoir un ensemble différent de règles de formatage. Prettier offre un terrain d'entente pour tous.

Maintenant, il y a quelques éléments que vous pouvez personnaliser, comme:

la largeur de l'onglet
l'utilisation de guillemets simples ou de guillemets doubles
le numéro des colonnes de la ligne
l'utilisation de virgules de fin

et quelques autres, mais Prettier essaie de garder le nombre de ces personnalisations sous contrôle, pour éviter de devenir trop personnalisable.

Installation

Prettier peut s'exécuter à partir de la ligne de commande et vous pouvez l'installer en utilisantFilounpm.

Un autre excellent cas d'utilisation de Prettier est de l'exécuter sur des PR pour votreGitréférentiels, par exemple surGitHub.

Si vous utilisez un éditeur pris en charge, la meilleure chose à faire est d'utiliser Prettier directement à partir de l'éditeur, et le formatage Prettier sera exécuté à chaque fois que vous enregistrez.

Par exemple, voici l'extension Prettier pour VS Code:https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

Plus joli pour les débutants

Si vous pensez que Prettier est juste pour les équipes ou pour les utilisateurs professionnels, il vous manque une bonne proposition de valeur de cet outil.

Un bon style impose de bonnes habitudes.

Le formatage est un sujet généralement négligé par les débutants, mais un formatage propre et cohérent est la clé de votre succès en tant que nouveau développeur.

Aussi, même si vous avez commencé à utiliserJavaScriptIl y a 2 semaines, avec Prettier, votre code - en termes de style - ressemblera à du code écrit à partir d'un Guru JavaScript écrivant JS depuis 1998.