Uniformise l’indentation de docker-compose.yml, des manifestes Kubernetes et des workflows GitHub Actions, met un espace régulier après deux-points et tirets et garde les commentaires. Les tabulations, interdites en YAML pour indenter, et les clés mal alignées sont repérées avec ligne et colonne avant que kubectl ou la CI ne protestent.
Mode d’emploi
- Choisissez le langage (il est détecté au collage ou au dépôt d’un fichier), puis collez le code ou ouvrez un fichier.
- Formater réécrit le code avec Prettier, ou sql-formatter pour le SQL. Réglez l’indentation et la largeur de ligne ; en JavaScript aussi les guillemets et points-virgules, en SQL le dialecte et la casse des mots-clés.
- Minifier supprime commentaires et espaces en HTML, CSS, JSON, XML, SQL et GraphQL. En JavaScript et TypeScript, seuls les espaces et commentaires sont compactés.
- Les erreurs de syntaxe indiquent la ligne et la colonne exactes avec un repère. Touchez l’erreur pour y aller.
- Copiez ou téléchargez le résultat, ou réutilisez-le comme entrée.
- Le formatage tourne dans un worker en arrière-plan, dans votre navigateur : les gros fichiers ne figent pas la page et votre code n’est jamais envoyé.
- Les plugins de chaque langage ne se chargent qu’à la première utilisation.
- Le JSON avec commentaires ou virgules finales (JSONC) est accepté pour le formatage ; la minification exige du JSON strict.
- YAML et Markdown ne peuvent pas être minifiés sans risque : seul le formatage est proposé.
Pourquoi utiliser un formateur
Un formatage homogène recentre les revues de code sur la logique plutôt que sur les espaces et garde les diffs petits. Prettier est dogmatique : il réimprime tout le fichier à partir de son arbre syntaxique, donc le résultat ne dépend pas de l’indentation d’origine. Vous ne choisissez que quelques options : largeur d’indentation ou tabulations, largeur de ligne (80 caractères par défaut) et, pour JavaScript, apostrophes ou guillemets et présence des points-virgules.
Comme le code est d’abord analysé, le formateur sert aussi de vérification rapide de la syntaxe. Une accolade manquante ou une balise non fermée stoppe le formatage et affiche un repère à la position exacte, souvent plus vite qu’une pile d’appels.
Embellir ou minifier
Embellir ajoute retours à la ligne et indentation pour les humains. Minifier retire commentaires et espaces pour les machines : en HTML, les blancs sont réduits mais le contenu de pre et textarea est préservé ; en CSS, les commentaires sautent sauf les blocs /*! licence */ ; en SQL, JSON, XML et GraphQL, on obtient une seule ligne compacte. Pour JavaScript et TypeScript, la minification ne compacte que blancs et commentaires, sans renommer les variables comme un bundler. YAML et Markdown dépendent des espaces : seul l’embellissement est proposé.
Formater du SQL
Le SQL n’a pas de style standard. Ici, les mots-clés peuvent être en MAJUSCULES ou en minuscules, et le choix du dialecte apprend au formateur la syntaxe de MySQL, PostgreSQL, SQL Server (T-SQL), Oracle PL/SQL, SQLite, BigQuery, Snowflake et d’autres : identifiants entre accents graves, conversions :: ou paramètres $1.
Questions fréquentes
Mon code est-il envoyé à un serveur ?
Non. Le formatage tourne dans un web worker de votre navigateur. Le code ne quitte pas votre appareil, ce qui compte pour du code propriétaire ou des fichiers contenant des identifiants.
Quels langages sont pris en charge ?
HTML, CSS, SCSS, LESS, JavaScript, JSX, TypeScript, TSX, JSON, SQL en 20 dialectes, XML, YAML, GraphQL et Markdown. Le langage est détecté quand vous collez ou déposez un fichier.
Le résultat est-il identique au Prettier de mon projet ?
Oui, avec les mêmes options. Le formateur est Prettier lui-même : avec la même indentation, la même largeur de ligne, les mêmes guillemets et points-virgules, vous obtenez le résultat de prettier --write.
Pourquoi le formatage échoue-t-il sur une erreur de syntaxe ?
Le formateur analyse le code avant de le réimprimer : un code invalide ne peut pas être formaté. Le message indique ligne et colonne ; corrigez l’erreur et le formatage repart.
La minification JavaScript renomme-t-elle les variables ?
Non. Elle ne retire que commentaires et espaces superflus. Pour des bundles de production avec renommage et suppression du code mort, utilisez un outil de build comme esbuild ou Terser.
Puis-je formater du JSON avec commentaires ?
Pour l’embellissement, oui : le JSON avec commentaires et virgules finales (JSONC, comme tsconfig.json) est accepté. La minification exige du JSON strict.