Formateur Less
Formatez des feuilles de style Less avec ce formateur Less. Collez du code Less et l’outil met en forme les variables, les règles imbriquées, les mixins avec paramètres, les appels de mixins, les gardes, les fonctions et les requêtes média, avec une indentation de deux espaces, une déclaration par ligne et un espacement cohérent après les deux-points et les virgules. Les valeurs par défaut des paramètres de mixins restent compactes ; les développeurs front-end obtiennent ainsi du code Less lisible sans lancer le compilateur.
Foire aux questions
Comment fonctionne le formateur Less ?
Il lit votre feuille de style sous forme de jetons, comme les accolades, les points-virgules, les deux-points, les chaînes et les commentaires, puis reconstruit la mise en forme à partir de ceux-ci. Chaque accolade ouvrante commence un bloc indenté de deux espaces et chaque déclaration occupe sa propre ligne.
Comment les variables sont-elles formatées ?
Les déclarations de variables telles que @color: #333; sont suivies d’une espace après les deux-points et se terminent par un point-virgule. Les références aux variables dans les valeurs sont conservées telles quelles.
Comment sont traités les mixins avec paramètres ?
Dans les parenthèses des paramètres de mixin, les deux-points restent attachés ; ainsi .mixin(@size:10px) conserve sa valeur par défaut compacte. Une seule espace est ajoutée après les virgules entre les arguments.
Les appels de mixins restent-ils sur leurs propres lignes ?
Oui, les appels tels que .mixin(5px); ou .bordered; se terminent par un point-virgule et occupent leur propre ligne dans la règle. Les sélecteurs imbriqués et les règles &:hover sont indentés d’un niveau supplémentaire.
Les fonctions et les opérations sont-elles modifiées ?
Les fonctions telles que darken(@color, 10%) sont conservées avec une espace après chaque virgule, et un signe plus est entouré d’une espace de chaque côté : 1px+2px devient 1px + 2px. Les gardes telles que when (@a > 0) restent sur la ligne du sélecteur.
L’outil compile-t-il mon code Less ou en vérifie-t-il la syntaxe ?
Non, il ne compile pas en CSS et ne valide pas la syntaxe ; il formate donc aussi les extraits inachevés. Utilisez le compilateur Less pour trouver les erreurs et produire CSS.
Les commentaires sont-ils préservés ?
Oui, les commentaires de ligne // sont conservés et terminent leur ligne ; le code suivant commence donc à la ligne d’après. Les commentaires de bloc sont conservés à leur emplacement.
Puis-je modifier l’indentation ?
Non, le formateur utilise toujours deux espaces et ne propose aucun réglage. La même feuille de style produit donc toujours le même résultat.
Pourquoi le résultat est-il encadré comme du less ?
Le résultat est renvoyé sous la forme d’un bloc de code Markdown marqué less, qui s’affiche avec une coloration syntaxique dans Markdown. Copiez les lignes entre les délimiteurs dans votre fichier .less.
Quelle peut être la taille de ma feuille de style ?
Jusqu’à 5 MB par exécution ; les entrées plus volumineuses sont rejetées avec un message. Le résultat est identique à l’option Less du formateur de code.