Beautifier LESS - sformatuj LESS w przeglądarce
LESS to starszy preprocessor CSS-a (kuzyn SCSS-a) - zmienne (`@var`), zagnieżdżanie, mixiny (`.mixin()`), guards. Beautifier używa Prettiera z parserem less.
LESS jest dziś mniej popularny niż SCSS, ale dalej żyje w wielu projektach (Bootstrap 3 był w LESS-ie, Ant Design używał LESS-a do v4, Semantic UI całość w LESS-ie). Format jest identyczny jak CSS, plus dodatkowe konstrukcje.
Akceptuje `.less`. Zmienne `@var` (LESS) ≠ `@media` (CSS at-rule) - Prettier rozróżnia kontekstowo.
Jak to działa
- Wybierz tryb (Grzeczny / Agresywny / Tylko wcięcia) lub zostaw domyślny.
- Wklej kod w lewy panel albo użyj "Wczytaj plik".
- Dostosuj ustawienia (koło zębate): wcięcie, szerokość, cudzysłowy, średniki.
- Kliknij Sformatuj - pierwszy raz potrwa chwilę (libki ładują się leniwie).
- Po prawej dostajesz wynik z syntax highlightingiem - kopiuj, pobierz albo otwórz w nowej karcie.
Kiedy się przydaje
Pięć sytuacji dla LESS:
- Bootstrap 3 fork. Stary projekt na BS3 ma własne LESS-y → beautify całość.
- Ant Design < v5. Customizacja motywu w LESS-ie - variables override.
- Migracja LESS → SCSS. Przed migracją: ujednolicasz format LESS-a.
- Refactor zmiennych. Po `@primary` → `@brand-primary` Find & Replace zostały rozjechane wcięcia.
- Tools / utility files. Mixin helpers w starych projektach.
Pytania i odpowiedzi
Tak - Prettier obsługuje LESS guards. Wcięcie zachowane, spacja przed `when`.