convert-scss-to-css

Web Scripts

Как конвертировать scss или sass в css

• 17-09-2019 •

Все проще чем вы думали!

Для начало, перед тем, как работать с sass или scss у вас должен быть установлен sass, для этого достаточно в командной строке написать следующее:


npm install -g sass

Это сработает, только, если у вас установлен Node.js, если же нет, то нужно установить!

Работаем с SCSS

Дальше для теста, создаем папку с файлом style.scss и открываем его через любой текстовой редактор.

Добавляем стиль


 .wrapper{
   background: #fff;

   .div{
     color: #ccc;
   }
 }

И сохраняем.

Как вы уже могли заметить, в отличие от простого css в данном примере я внутри класса wrapper прописал стиль для класса div. Более подробно о scss вы можете почитать в статье вот тут.

Возвращаемся обратно в консоль, в консоле переходим в ту директорию, в которой лежит файл.

Если вы на windows, то можно зажать shift и правую кнопку мыши, тогда в списке появиться пункт “Открыть окно PowerShell здесь

Осталось написать команду, которая сконвертирует наш css файл


sass style.scss style.css

В папке у вас появятся 3 файла, как на скриншоте:

scss-to-css

Так же вы можете указать отдельную папку для файла css, пример:


sass style.scss css/style.css

Вот и все дела)

Добавить комментарий