Для автоматической генерации css-файла из scss, на вашем ПК должен быть установлен sass, который как раз и будет делать основную магию.
В PhpStorm, в настройках в разделе "Tools" в подразделе "FileWatchers" добавлем один вотчер, который будет при каждом изменении файла со стилем создавать его css-версию. Вот такие основные параметры:
- File type: SCSS style sheet
- Program: sass
- Arguments: $FileName$:$FileNameWithoutExtension$.css --style=expanded
- Output paths to refresh: $FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map
- Working directory: $FileDir$
Это стандартный набор параметров - добавляется автоматически при создании обработичка
Тут все хорошо, но для ускорения нужно иметь сжатую версию файла со стилями, min.css и вот для минимизации ее нужно сделать еще один вотчер, но чуть с другими параметрами:
- File type: SCSS style sheet
- Program: sass
- Arguments: $FileName$:$FileNameWithoutExtension$.min.css --style compressed
- Output paths to refresh: $FileNameWithoutExtension$.min.css:$FileNameWithoutExtension$-min.css.map
- Working directory: $FileDir$
Такая вот "магия" будет создавать/обновлять и css-файлы стилей и их минимизированные версии при сохранении родительского scss-файла. Останется только добавить обновления в GIT и задеплоить на сервер.
