Less первое знакомство

Автор: | 27.04.2019

Это динамический язык стилей с открытым исходным кодом.

Установить компилятор lessc:

  • npm install -g less

Получить помощь по командам компилятора:

  • lessc —help
  • lessc —h

Скомпилировать без сохранения результата:

  • lessc style.less

, с сохранением результата:

  • lessc style.less > main.css

Минификация файла на выходе:

  • lessc -x style.less

, но без сохранения результата. Для минификации css нужен плагин. Для Less доступно некоторое множество плагинов, которые добавляют различный функционал препроцессору. Включением и выключением этих плагинов, а также их управлением можно заниматься и с помощью консольных команд.

Допустим, что у вас установлен пакет для минификации css-файлов less-plugin-clean-css. Тогда пользователю будет доступен новый параметр —clean-css для передачи скрипту.

Получить карту кода при компиляции:

  • lessc —source-map style.css

И напоследок, пример установки некоторых плагинов. Установка плагина минификации css:

  • npm i -g less-plugin-clean-css
  • lessc —clean-css style.less

Установка плагина позволяющего создавать пользовательские функции:

  • npm i -g less-plugin-functions
  • lessc —functions style.less

Компиляция с несколькими плагинами:

  • lessc —functions —inline-urls style.less