В чем разница между препроцессором и постпроцессором

Препроцессоры (например, Sass, Less) обрабатывают код до компиляции в CSS, добавляя функциональность вроде переменных, миксинов, вложенности. Постпроцессоры (например, PostCSS) работают после компиляции, оптимизируя или добавляя вендорные префиксы.

Пример препроцессора (Sass):

$primary-color: #333;
body {
  color: $primary-color;
}

Пример постпроцессора (PostCSS):

/* До: */ .box { display: flex; }
/* После: */ .box { display: -webkit-box; display: -ms-flexbox; display: flex; }

Препроцессоры расширяют синтаксис, постпроцессоры — улучшают готовый CSS.