@use / @forward

Definition

@use importe un module Sass avec un namespace (variables accessibles via module.$var). @forward re-exporte les membres d'un module pour creer des points d'entree.

Analogie

@use c'est importer un outil, @forward c'est le mettre en vitrine dans ta boutique pour les autres.

Exemple de code

// _colors.scss
$primary: blue;

// _index.scss
@forward 'colors';

// component.scss
@use 'settings'; // => settings.$primary
// ou @use 'settings' as *; // => $primary

Cas d'usage

Remplacer @import (deprecie) par un systeme de modules avec namespaces et encapsulation.

Anti-pattern

Termes lies