sass dart-sassでbootstrapのprimaryの色を変える（@import, @use）

基本

dart-sassでは@importじゃなく@useを使えってことなんだけど、@importで出来たことをひと手間加えなくちゃいけない

@importでbootstrapのprimaryの色を変更

ひとまず「@import」のときの色変更

$primary: red;
@import "bootstrap.scss";

@useでbootstrapのprimaryの色を変更

@use "bootstrap.scss" with(
  $primary: red,
);

primaryとdangerと…複数の色を変更

@use "bootstrap.scss" with(
  $primary: red,
  $danger: blue,
  $info: green,
);

色設定を別のファイルでする場合

▼「_setting.scss」 - 色設定をする別ファイル

$primary: red;

▼「layout.scss」 - コンパイルする対象のファイル

@use "setting" as *; // 名前空間は省略。省略したくなければ省略不要
@use "bootstrap.scss" with(
  $primary: $primary,
  // $primary: setting.$primary, // ←名前空間を省略していない場合
);