CSScomb.js + PhpStorm

Статья последний раз была обновлена 16.05.2023

CSScomb — это утилита, которая форматирует CSS. Сегодня расскажу как ее подружить с PhpStorm.

Установка CSScomb.js

Устанавливается CSScomb.js через npm глобально. Надеюсь вы включили в PATH путь к модулям Node.

npm install csscomb -g

Теперь его можно пользовать отовсюду.

Дружим PhpStorm с CSScomb.js

У PhpStorm есть конечно собственное форматирование кода, но у него мало настроек и оно не поддерживает сортировку свойств. Собственно PhpStorm умеет запускать внешние команды, добавлять их в пункты меню и вешать их на горячие кнопки.

Добавляем новую внешнею команду:

File->Settings->IDE Settings->External Tools->+

Появится окно, в котором надо будет задать настройки. Остановлюсь на тех, которые имеют значение:

• Program: csscomb
• Parameters: $FilePath$
• Working directory: $ProjectFileDir$

В Windows XP, это не сработало, и вместо csscomb надо указать полное название файла csscomb.cmd

Все! Теперь можете кликать на файл в дереве и запускать csscomb, или поставить исполнение на горячую клавишу и пользовать ее.

Настройки CSScomb

Их можно задать в файле .csscomb.json, который должен лежать в корне рабочей директории. Вот мой конфиг >>

Удачи!