Работа с LESS в PhpStorm
Опубликовано: 21.10.2017
В этом посте я кратко расскажу о плагине “LESS CSS compiler” для PhpStorm , который я использую для работы с LESS в этой прекрасной IDE от JetBrains. Зачем он нужен, в чём плюсы, какой я нашёл недостаток и как с ним можно справится, рассказано ниже.
Как уже писал в одном из предыдущих постов , основой для дизайна своего блога я выбрал бесплатную версию CSS-фреймворка от PixelKit . Фреймворк поставляется в двух вариантах: как набор CSS-стилей и в виде *.less файлов. Начал я, естественно, с CSS. И очень скоро задумался об оптимизации — уж больно пухлый style.css у меня получался. Тут я вспомнил о LESS-версии фреймворка… Она была скачана, перемещена куда нужно, и встал вопрос "а чем же все это компилировать?".
Нужно было решение, которые могло бы компилировать *.less файлы на лету, сразу после их изменения. Недолго думая, я пробежался по репозиторию плагинов для PhpStorm. К счастью, там обнаружилось несколько плагинов, которые обещали именно то, что мне нужно. Я решил попробовать один их них. Это был " LESS CSS compiler ".
После установки, плагин добавляет своё меню настроек к стандартным настройкам среды. Пункт называется " LESS Profiles ". Как видно из названия, здесь настраиваются профайлы для LESS компиляции.
Предварительные настройки плагина LESS CSS compiler
Существуют две полезные настройки, позволяющие быть более гибким в расположении *.less-файлов. Плагину можно указать, какие ещё файлы нужно включить в проект (указав через запятую путь к ним). Но, что более важно, существует настройка, говорящая, какие файлы не нужно компилировать. Зачем она нужна? Дело в том, что, как правило, стили компилируются из нескольких *.less-файлов в один итоговый. Если не исключить все файлы, кроме заглавного, то после нескольких правок возле каждого *.less-файла появится скомпилированный для него *.css-файл с таким же именем. А вот если все основные *.less-файлы, кроме заголовочного, аккуратно лежат в отдельной папке, её можно добавить в исключения и тогда при компиляции на выходе получится только один выходной файл.