Форматиращ инструмент за SCSS
Форматирайте таблици със стилове Sass SCSS с този инструмент за форматиране SCSS. Поставете SCSS и инструментът подрежда вложени правила, променливи, миксини, включвания, родителски селектори и контролни директиви с отстъп от два интервала, по една декларация на ред, интервал след двоеточието в свойствата и добавени липсващи точка и запетая. Интерполациите и коментарите се запазват, така че фронтенд разработчиците могат да подреждат частични файлове и фрагменти, без да ги компилират.
Често задавани въпроси
Как работи инструментът за форматиране на SCSS?
Той чете таблицата със стилове като поредица от токени, например фигурни скоби, точка и запетая, двоеточия, низове и коментари, и възстановява подредбата въз основа на тях. Всяка отваряща фигурна скоба започва блок с отстъп, а всяка декларация завършва на отделен ред.
Поддържа ли се влагане?
Да, вложените правила и родителските селектори като &:hover получават отстъп с едно ниво повече от родителя си — по два интервала на ниво. Двоеточията в селекторите остават на мястото си, така че &:hover не се разделя.
Как се форматират променливите, миксините и включванията?
След двоеточието в декларациите на променливи като $color: #333; се добавя интервал, а @mixin и @include запазват аргументите си с интервал след всяка запетая. Преди скобата на контролни директиви като @if, @each и @for се добавя интервал.
Запазват ли се интерполациите?
Да, интерполациите като #{$name} се копират точно както са написани. Това включва интерполации в селектори, например .icon-#{$name}, и в имена на свойства.
Компилира ли инструментът моят SCSS или проверява ли го?
Не, той не компилира до CSS и не проверява синтаксиса, затова форматира и незавършени фрагменти. Използвайте компилатора Sass, за да откриете грешки и да създадете CSS.
Запазват ли се коментарите?
Да. Коментарите на ред, започващи с //, завършват реда си, а блоковите коментари се запазват там, където се намират.
Работи ли със синтаксиса на Sass с отстъп?
Не, инструментът е предназначен за SCSS, който използва фигурни скоби и точка и запетая. Файловете със синтаксис .sass с отстъп нямат фигурни скоби, спрямо които да се зададе отстъп, затова първо ги преобразувайте в SCSS.
Мога ли да променя отстъпа?
Не, резултатът винаги използва два интервала, а форматиращият инструмент няма настройки. Затова една и съща таблица със стилове винаги дава един и същ резултат.
Защо резултатът е ограден като scss?
Резултатът се връща като кодов блок Markdown с обозначение scss, така че се показва с оцветяване на синтаксиса. Копирайте редовете между ограждащите маркери във вашия .scss файл.
Какъв е максималният размер на таблицата ми със стилове?
До 5 MB на изпълнение; по-голям вход се отхвърля със съобщение. Резултатът е идентичен с опцията SCSS на Code Formatter.