Как сделать из css файла — конфетку?

Question

[Alex Mustdie]

Доброго времени суток!

Лично у меня вёрстка сайта вызывает страшный геморрой. Сначала стараешься следить за тем, чтобы css был более-менее приличный, но спустя какое-то время всё это превращается в хаотичное месиво. Собственно, возможно ли как-то без рук отсортировать все свойства, сделать так, чтобы не было повторов и всё расставить по полочкам?

Заранее спасибо.

Answer 1

[Aleksandr]

используйте какой-нибудь сборщик, например gulp
и плагины для него, аля gulp-uncss, gulp-csso, gulp-csscomb

Comments

[ElizarBatin]

PostCSS быстрее

Answer 2

[Vladimir Abiduev]

BEM и любой css.concater, или даже не BEM, но много файлов. Просто разносишь по файлам компоненты, они склеиваются и все счастливы.
+gulp/grunt

Answer 3

[zooks]

Используй препроцессоры, конкретно рекомендую libsass - SASS, портированный на C.
Подключается как nodesass к Gulp.js.
Ну и возьми литературку по CSS, восполни пробелы в знаниях.

Answer 4

[Сергей Иванов]

Если придерживаться одного из стандартов , то проблем не будет. Просто в html и css редко соблюдаются какие либо стандарты и поэтому каша обеспечена будет. Сборщики вам могут и навредить да и в целом проблемы не решит.

Answer 5

[mr-molodoy]

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

Answer 6

[Александр Таратин]

https://github.com/csscomb/sublime-csscomb

Answer 7

[Максим Чалов]

Препроцессоры + заранее выбранная система для общей структуры, построения идентификаторов и т.д. Препроцессоры — LESS (lesscss.org/) или SASS (sass-lang.com/).
Прелесть как минимум в легкости поддержания порядка даже для сложных проектов; в использовании единых переменных и mixins, разнесении блоков правил для исключения повторов.
На уровне сборки уже можно минифицировать и т.д., благо на удобство тестирования это негативно не повлияет. Т.е. в чистый css вы вообще не будете смотреть в процессе работы никогда.