Less-Formatter
Formatiere Less-Stylesheets mit diesem Less-Formatter. Füge Less-Code ein; das Tool ordnet Variablen, verschachtelte Regeln, Mixins mit Parametern, Mixinanweisungen, Bedingungen, Funktionen und Medienabfragen mit zwei Leerzeichen Einrückung, einer Deklaration pro Zeile und einheitlichen Abständen nach Doppelpunkten und Kommas. Standardwerte für Mixin-Parameter bleiben kompakt. So erhalten Frontend-Entwickler lesbaren Less-Code, ohne den Compiler auszuführen.
Häufig gestellte Fragen
Wie funktioniert der Less-Formatter?
Er liest dein Stylesheet als Token wie Klammern, Semikolons, Doppelpunkte, Zeichenfolgen und Kommentare und erstellt daraus eine neue Formatierung. Jede öffnende Klammer beginnt einen Block, der um zwei Leerzeichen eingerückt ist, und jede Deklaration steht in einer eigenen Zeile.
Wie werden Variablen formatiert?
Variablendeklarationen wie @color: #333; erhalten ein Leerzeichen nach dem Doppelpunkt und enden mit einem Semikolon. Variablenverweise innerhalb von Werten bleiben wie geschrieben erhalten.
Wie werden Mixins mit Parametern behandelt?
In den Parameterklammern eines Mixins bleibt der Doppelpunkt direkt am Namen, sodass .mixin(@size:10px) seinen kompakten Standardwert behält. Zwischen Argumenten steht nach jedem Komma genau ein Leerzeichen.
Bleiben Mixin-Aufrufe in eigenen Zeilen?
Ja, Aufrufe wie .mixin(5px); oder .bordered; enden mit einem Semikolon und stehen innerhalb der Regel in einer eigenen Zeile. Verschachtelte Selektoren und &:hover-Regeln werden eine Ebene tiefer eingerückt.
Werden Funktionen und Operationen geändert?
Funktionen wie darken(@color, 10%) erhalten nach jedem Komma ein Leerzeichen. Vor und nach einem Pluszeichen steht jeweils ein Leerzeichen, sodass aus 1px+2px 1px + 2px wird. Bedingungen wie when (@a > 0) bleiben in der Selektorzeile.
Kompiliert das Tool meinen Less-Code oder prüft es ihn?
Nein, es kompiliert nicht zu CSS und validiert auch nicht die Syntax. Daher formatiert es auch unfertige Codeausschnitte. Verwende den Less-Compiler, um Fehler zu finden und CSS zu erzeugen.
Bleiben Kommentare erhalten?
Ja, //-Zeilenkommentare bleiben erhalten und beenden ihre Zeile, sodass der nächste Code darunter beginnt. Blockkommentare bleiben an ihrer Position erhalten.
Kann ich die Einrückung anpassen?
Nein, der Formatter verwendet immer zwei Leerzeichen und bietet keine Einstellungen. Daher liefert dasselbe Stylesheet immer dasselbe Ergebnis.
Warum ist die Ausgabe von less-Codebegrenzungen umschlossen?
Das Ergebnis wird als Markdown-Codeblock mit der Kennzeichnung less zurückgegeben und in Markdown mit Syntaxhervorhebung dargestellt. Kopiere die Zeilen zwischen den Begrenzungen in deine .less-Datei.
Wie groß darf mein Stylesheet sein?
Bis zu 5 MB pro Durchlauf. Größere Eingaben werden mit einer Meldung abgelehnt. Die Ausgabe entspricht der Less-Option des Code-Formatters.