LESS online zu CSS kompilieren – less.js im Browser
Kompilieren Sie ein LESS-Snippet oder bündeln Sie einen lokalen Projektordner mit nativer @import-Auflösung. Komprimierung und Source-Maps für Einzeldateien — alles läuft in Ihrem Browser.
Entwicklerhinweise
• Legen Sie einen Projektordner ab, um lokale @import-Pfade aufzulösen. node_modules, Pakete und entfernte URLs werden nicht aufgelöst. • Inline-JavaScript in LESS ist standardmäßig deaktiviert; aktivieren Sie es nur, wenn Sie der Quelle vertrauen. • Strict math erfordert Klammern um Berechnungen, wenn aktiviert. • Auto-Kompilierung beim Einfügen/Beispiel; getippte Änderungen benötigen Kompilieren (⌘↵). • Source-Maps sind für Einzeldateien verfügbar und im Bundle-Modus v1 nicht verfügbar.
Lokale Partials bündeln
Wählen Sie Projekt bündeln, legen Sie einen Ordner ab und bestimmen Sie eine Einstiegsdatei. FastMinify erhält relative Pfade, während Less erreichbare .less-Dateien über @import findet. Das browserlokale Limit beträgt 32 MiB pro Datei und insgesamt. Version 1 unterstützt einen Einstieg, keine Source-Maps und keine node_modules-Pakete.
Optionen
Wann Teams diesen Weg wählen
• Legacy-LESS-Komponenten für Migration in CSS umwandeln. • Parametrische Mixins vor Integration in einen Build ansehen. • Kompiliertes CSS mit Teamkollegen teilen, die LESS nicht nutzen. • Guard-Ausdrücke und Operationen schnell prüfen.
Ausgearbeitete Beispiele
Variablen und Operationen
LESS-Eingabe
Kompiliertes CSS
Parametrisches Mixin
LESS-Eingabe
Kompiliertes CSS
Verwandte Tools
Verschönern Sie LESS mit LESS verschönern, dekomprimieren Sie mit LESS entminifizieren, oder durchsuchen Sie den CSS-Präprozessoren-Hub.
LESS-Compiler FAQ
Nur Browser-Kompilierung
Warum kann ich @import für Bootstrap oder andere Bibliotheken nicht verwenden?
Projekt-Bundles lösen lokale .less-Dateien auf, die Sie im Browser ablegen. Pfade zu node_modules, Paketen, CDNs oder außerhalb des abgelegten Ordners sind nicht verfügbar.
Was bewirkt Strict math?
Wenn aktiviert, erfordern Berechnungen wie 8px + 4px Klammern. Dies entspricht strengeren LESS-Compiler-Modi in einigen Build-Pipelines.
Wann läuft die Kompilierung automatisch?
Beim Einfügen und Laden von Beispielen. Alleiniges Tippen löst keine Kompilierung aus — verwenden Sie Kompilieren oder ⌘↵.
Ist ein Projekt-Bundle dasselbe wie Dateiverkettung?
Nein. Less beginnt mit einer Einstiegsdatei und löst nur erreichbare @import-Abhängigkeiten auf. Es gibt keine manuelle Dateireihenfolge. Version 1 ist auf einen Einstieg und 32 MiB insgesamt begrenzt, ohne Source-Maps oder npm-Paketimporte.
CSS-Präprozessoren
Kompilieren Sie SCSS oder LESS zu Standard-CSS im Browser — kombinieren Sie mit Beautify oder Minify für einen vollständigen Stylesheet-Workflow.
Weitere Werkzeugkategorien entdecken
Minimieren
Verkleinern Sie Code und Ressourcen für die Produktion – minimieren Sie JavaScript, CSS, HTML, JSON und XML vor der Bereitstellung von gzip oder CDN.
Aufheben
Erweitern Sie minimierten oder komprimierten Code – entminifizieren Sie JavaScript, CSS, TypeScript, SCSS, LESS, SQL, YAML und andere Formate beim Debuggen oder Überprüfen.
Konvertierung
Transformieren Sie Daten zwischen JSON, YAML, XML und CSV lokal – keine Server-Uploads.
Codierung
Kodieren oder dekodieren Sie Base64-, URL-Komponenten und HTML-Entitäten – nur clientseitig.
Serialisierung
Serialisieren und deserialisieren Sie PHP-Datenstrukturen neben JSON-Workflows.
JSON Werkzeuge
Validieren, formatieren, vergleichen und erkunden Sie JSON-Nutzlasten – ergänzend zu Minifiern und Konvertern.
SVG Werkzeuge
Vorschau anzeigen, mit SVGO optimieren, Daten exportieren URI, Größe ändern, verschönern, in JSX konvertieren und SVG validieren – alles in Ihrem Browser.
Verschönern
Machen Sie Code mit konsistenter Einrückung lesbar – verschönern Sie JavaScript, CSS, TypeScript, SCSS, LESS, Markdown, GraphQL, SQL, YAML und mehr in Ihrem Browser.
Farb- & CSS-Tools
Lokal eingefügte WCAG-Kontrastprüfung mit moderner CSS-Farbsyntax — Paar- und Matrixansicht, nie hochgeladen.
DevOps und Infrastruktur
Terraform HCL formatieren/validieren/minimieren, Dockerfile formatieren und lint, Docker Verfassen und .env-Validierung.
CI/CD
GitHub Aktionen und GitLab CI – formatieren Sie YAML und überprüfen Sie die Workflow-/Auftragsstruktur in Ihrem Browser.
Protokolle und Beobachtbarkeit
Zeilenorientierte JSON/NDJSON- und Nginx/Apache-Zugriffsprotokolle – formatieren, filtern, validieren und CSV/TSV.
Kubernetes
Multi-Doc-Manifeste, strukturelle Validierung, Ingress/Deployment-Starter und Helm-Werteformatierung.
Netzwerk / IP
CIDR, Subnetze und IPv4/IPv6-Helfer — im Browser.
Sicherheit und Token
JWKS, X.509-Zertifikate und Secrets-Scan – browserlokal.
API & Schemata
OpenAPI Tools zum Formatieren, Validieren und Flusen Ihrer Spezifikationen.
HTTP-Tools
cURL, HTTP-Nachrichten, URLs, HAR und Cookie/Set-Cookie lokal einfügen — formatieren und prüfen, nie gesendet.
Entwickler-Dienstprogramme
Zeitstempel, UUID, ULID, Nanoid, Cron, Passwörter, Regex, Slugify, Zahlenbasen, Groß-/Kleinschreibung, Textunterschied und chmod – alles clientseitig.
Text & Markdown
Wörter zählen, Markdown-TOC erzeugen und Zeilenlisten bereinigen — im Browser.
KI & LLM
Token-Zählung, Kostenschätzung und Kontextfenster — 100 % im Browser.
Testdaten
Synthetische Feldwerte für Fixtures und DB-Seed — zuerst reservierte Telefonnummern.