Why do you need PostCSS? How to use it in conjunction with SCSS and Gulp?

Question

css

Good afternoon. Now more and more often in vacancies I see the mention of PostCSS in the list with Sass and Gulp.
I have no experience with PostCSS personally. I would like to understand what it can give, what killer features, since I could not figure it out by reading about it. It seems to be, according to the definition of PostCSS, a program that automates routine operations with CSS, the same Sass does it well, prefixes, optimization, compression - it seems that Gulp does all this well, so what is PostCSS for? And isn’t it more logical and correct to entrust such processes as file compression, sprite creation to a tasker, and not to plugins for automating routine CSS operations?

Answer 1

If used with sass and galp - there is no point in postcss
Prefixes have not been used by browsers for a bunch of years
They indicate it because of the dense advertising of Martians - the author does not climb out of conferences
At interviews in such offices, you can always ask the question - what frameworks do they use on this postprocessor

Answer 2

You are confusing "soft" with "fluffy". They have different tasks.
GULP is a tool for launching tasks, what you put in these tasks is up to you.
SCSS/LESS is pure syntactic sugar for css. All these variables, mixins, imports and so on are just to make you write less code. Those. You can’t put any logic there, pure declarative.
PostCSS is for smarter post-processing. You can before compilation, you can after (it doesn't matter) - how to process your styles. The same autoprefixer is precisely the post-processing of styles according to certain rules, i.e. there is a working logic. This tool is written in such a way that it can work with all the zoo that is now divorced.

Answer 3

Gulp has already been answered.
SASS, LESS are like new style languages ​​transpiled into regular CSS. They have their own, separate, CSS-compatible syntax, mixins, variables, functions, and more.
PostCSS - by itself - is just a modular parser. It provides an easy way to write plugins. And there are really a lot of them. You can put SCSS-like syntax, and hardly notice the differences. And hang a couple of plugins like autoprefixer from above. How and what will be processed is up to you. I recommend postcss-cssnext, a pre-built set of features that all browsers should support in the future.