Как быстро удалить не используемый css из проекта?

Question

[ForestEsprit]

Всем привет! Проект собран на middleman, в нём хранится куча sass файлов, которые обитают там уже 2 года. Всё пришло к состоянию, когда никто точно не знает, что из этого используется, а что нет. Кто знает способ быстро и безболезненно всё почистить? Проект всегда собирается перед размещением, то есть я не трогаю скомпиленный css.

Comments

[littleguga]

Если вопрос решен, отметьте решения, пожалуйста.

[ForestEsprit]

littleguga: К сожалению вопрос не решился, ваше решение мне понятно, но в тот проект не вписалось.

[littleguga]

ForestEsprit: что помешало вписать в проект?

[ForestEsprit]

littleguga:Переводить на grunt/gulp было не нужно, проблему со скриптом уже вспомнить не могу. Суть такая, проект на middleman (haml, scss), сборка идёт на сервере, то есть я на неё уже не влияю. Возникла потребность проверить scss файлы и в них удалить не используемый css.
Проекту 3 года, документации нет, внутри проекта код от 4-х редизайнов. Если со скриптами все ок, то css стал помойкой.

Решение под grunt/gulp с in css хорошее, но оно чистить уже css файл (хотя в текущем проекте этого более чем достаточно)

[littleguga]

ForestEsprit: можно было локально компильнуть проект и прогнать уже им. Но раз уже неактуально, то что уж...

[ForestEsprit]

littleguga: а как именно? (Все равно интересно, заеду к ребятам и наконец сделаю)

[littleguga]

ForestEsprit: соберите исходники локально, а не на сервере. Gulp позволяет компилировать haml+scss и потом уже пройдитесь по полученным css

[ForestEsprit]

littleguga: ну хорошо, предположим я прошлась по полученному css файлу, но мне придётся делать это каждый раз при обновлении проекта и не решает тот момент, что в sсss файлах остаётся много лишнего. Грубо говоря код на проде меня не волнует, разработке мешают неиспользуемые стили до какой-либо сборки. (ну грубо говоря у меня в каждом файле 1000 строк, а из них юзается 300 и таких файлов штук 15 по разным папкам. Понятно что процесс поиска занимает слишком много времени, нужна реорганизация стилей, на что времени не выделяется (плохой случай), хотя бы почистить лишнее в рабочих файлах)

Вариант предложенный командой — руками, но руками перебирать писанину уже 3-х лет от разных разработчиков и руками прощёлкивать все страницы сайта, на это просто никто не выделит время.

[littleguga]

ForestEsprit: вы найдете неиспользуемые стили, потом простым скриптиком их удалить из файлов scss.

Answer 1

[littleguga]

Вот тут есть хороший ответ.

1. Для нахождения и удаления неиспользуемых css - есть uncss(под gulp/grunt)
2. Для нахождения неиспользуемых переменных в SASS/LESS - используйте скрипт, например, как этот.
3. Для debug'a - source map

Остальное - минификация, префиксы.

Comments

[Кирилл]

Про UnCSS - может я не разобрался, но он удалял в том числе и стили, заданные через media, но не активные в данный момент. И стили типа nav.active {blabla}, хотя они тоже нужны, но не активны в данный момент.

[Руслан Бергутов]

Кирилл Кубляков: тебе нужно прописать свойство ignore правильно, гугли : uncss ignore

[Кирилл]

Руслан Бергутов: Спасибо, погуглю!

Answer 2

[Михаил Попов]

Я пользуюсь MinCss https://pypi.python.org/pypi/mincss Работает очень хорошо. Складывает в папочку уже обрезанные css-ки. Остается их только на сайте заменить. Записал видео, где все понятно показано, как что делать: https://www.youtube.com/watch?v=Vg7XvAJz7H4

Comments

[Михаил Попов]

Ок. Подправил ссылочку.