DartSass @use・@fowardについて パート2 asを使って名前を付ける

＜前提＞

　①定義したファイル　

　　例）ファイル名<base/variable.scss>

　②定義系をいろいろまとめたファイル　

　　例）ファイル名<base/foundation.scss>

　　　　例）variable mixinなど

　③変数を使って呼び出したいファイル

      例）ファイル名<text.scss>

■@fowardでasを使って名前を付ける方法

　同じファイル名があった際ネーム空間が重複してしまう。

　重複するとエラーになるのでネームスペースを自分で固定してエラーを回避する

　ネームスペース＝「as〇〇」

　※特に指定しない場合はファイル名＝ネームスペース

■@foward

①<base/variable.scss>

fontについて定義したファイル

$font-color:red;

②<base/foundation.scss>

　定義系をまとめたファイル

　橋渡しができるようにfoundationのファイルに＠forwardを記載

＠forward"base.variable"

③<text.scss>

＠useファイル名.変数名を使って呼び出し

「foundationファイルを呼び出すには「f」を使って呼び出します」と宣言

@use"base/foundation" as f
.h1 {color: f.$font-color;}

ネームスペース指定しない場合の記載

もしファイル名が重複するとエラーになる

@use"base/foundation" 
.h1 {color: foundation.$font-color;}