SASSのデフォルト変数

場合によっては、変数の値がまだ定義されていないが、コード内で使用する必要がある場合、デフォルト値を設定することができます。その後に!defaultのマークを付けます。

注意すべき点は、変数にすでに以前に値が割り当てられている場合、その値は以前のままですが、新しい空の変数を作成した場合、デフォルト値が指定されることです。

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

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

上記のコードをコンパイルした結果は以下のようになります：

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

変数にnullを設定した場合、 !defaultはその変数を値を持たないものとみなします：

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

#main {
	name: $name;
}

コンパイル後、次のようになります：

#main {
	name: "Bob"; 
}