PostCSS

Testing 🟡 Mid

Définition

Outil de transformation CSS via plugins. Autoprefixer (ajout de préfixes vendeur) et Tailwind CSS sont ses plugins les plus connus. Babel équivalent pour le CSS.

Analogie

Comme une chaîne de montage pour le CSS : chaque plugin ajoute une transformation spécifique a votre feuille de style.

Exemple de code

// postcss.config.js
module.exports = {
  plugins: [
    require('tailwindcss'),
    require('autoprefixer'),
    require('cssnano')({ preset: 'default' }),
  ],
};

Cas d'usage

Pour ajouter automatiquement les préfixes vendeur et optimiser le CSS en production.

Anti-pattern

Empiler trop de plugins PostCSS custom au lieu d'utiliser des solutions natives CSS (nesting, variables).
#build#tooling#css

← → au clavier pour passer d'une fiche à l'autre