CSS Nano

CSS-in-JS 🟢 Junior

Définition

Plugin PostCSS de minification CSS. Supprime les espaces, commentaires, raccourcit les couleurs et propriétés pour réduire la taille du fichier CSS final.

Analogie

Un compresseur de valise : même contenu, mais ca prend beaucoup moins de place.

Exemple de code

/* Avant: 234 bytes */
.card {
  background-color: #ffffff;
  margin: 0px 0px 0px 0px;
  padding: 16px;
}
/* Apres cssnano: 48 bytes */
.card{background:#fff;margin:0;padding:16px}

Cas d'usage

Réduire la taille du CSS en production pour améliorer les temps de chargement.

#styling#css-in-js

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