Variables par défaut dans SASS

Dans certains cas, si la valeur d'une variable n'est pas encore définie, mais qu'elle doit être utilisée dans le code, nous pouvons lui attribuer une valeur par défaut, après laquelle nous ajoutons le marqueur !default.

Il est important de noter que si la variable a déjà été assignée auparavant, alors elle gardera sa valeur précédente, mais si nous avons créé une nouvelle variable vide, alors la valeur par défaut lui sera attribuée.

$name: "John";
$name: "Bob" !default;
$new_name: "Mark" !default;

#main {
	name: $name;
	new_name: $new_name;
}

Le résultat de la compilation du code ci-dessus sera le suivant :

#main {
	name: "John";
	new_name: "Mark";
}

Si nous attribuons à la variable la valeur null, !default la considérera comme n'ayant pas de valeur :

$name: null;
$name: "Bob" !default;

#main {
	name: $name;
}

Après compilation, nous verrons :

#main {
	name: "Bob"; 
}