Запропонувати правкуПокращити цю статтюДопрацюйте відповідь до «Що таке PostCSS?». Ваші зміни проходять модерацію перед публікацією.Потрібне підтвердженняКонтентЩо ви змінюєте🇺🇸EN🇺🇦UAПереглядЗаголовок (UA)Коротка відповідь (UA)**PostCSS** - це постпроцесор і водночас платформа для плагінів, яка приймає на вхід звичайний CSS і дає змогу за допомогою набору плагінів модифікувати його перед відправленням у продакшен. **Ключове:** це механізм, який розширює і поліпшує готовий CSS за рахунок підключених модулів, а не "ще один препроцесор".Показується над повною відповіддю для швидкого нагадування.Відповідь (UA)ЗображенняPostCSS - це постпроцесор і водночас платформа для плагінів, яка приймає на вхід звичайний CSS і дає змогу за допомогою набору плагінів модифікувати його перед відправленням у продакшен. По суті, це не "ще один препроцесор", а **механізм, який розширює і поліпшує готовий CSS за рахунок підключених модулів**. --- ### **Ключова ідея** PostCSS сам по собі майже нічого не робить - він працює як конструктор. Результат залежить від того, які плагіни до нього підключені. Через це його називають **"платформою для обробки CSS"**, аналогічно до того, як Babel обробляє JavaScript. --- ### **Які завдання він вирішує (через плагіни)** - **Autoprefixer** - додає крос-браузерні префікси - **cssnano** - мінімізує CSS - **postcss-preset-env** - дає змогу писати майбутній CSS, перетворюючи його під поточні браузери - **PurgeCSS / postcss-purgecss** - видаляє невикористані стилі - **postcss-sort-media-queries** - об'єднує і сортує медіа-запити - **postcss-import** - дає змогу використовувати імпорти і збирати CSS як модулі --- ### **Чим PostCSS вигідно відрізняється від SASS/LESS** | Інструмент | Функція | |---|---| | **SASS/LESS** | допомагає писати зручний розширений синтаксис → генерує CSS | | **PostCSS** | поліпшує вже готовий CSS → робить його оптимальним для браузерів | Вони **не конкуренти**, а часто використовуються в одній збірці: **SASS → CSS → PostCSS → продакшен** --- ### **Чому PostCSS популярний** - гнучкість (підключаєш тільки потрібні плагіни) - величезна екосистема - підходить під будь-яку збірку: Webpack, Vite, Gulp, Parcel - відповідає вимогам продакшена: оптимізація, крос-браузерність, чистота --- **Коротко:** PostCSS - це інструмент для автоматичної обробки CSS на етапі збірки, заснований на плагінах. Він відповідає за те, щоб готові стилі були **сумісними, легкими, сучасними і оптимізованими для браузерів**.Для рев’юераПримітка для модератора (необов’язково)Бачить лише модератор. Прискорює рев’ю.