しらべものドット宇宙HTMLコーダーが必死こいて〇〇〇を目指すブログ

【Sass】Partial機能を使って、Sassファイルを分割して管理・運用する。

Sass Basics | Sass
https://sass-lang.com/guide

Sassは、スタイルシートを分割して管理・保守していいくことができる。

1.分割されたスタイルシートを用意する

分割されたスタイルシートは、ファイル名の冒頭にアンダーバー(__)を2つつけて、分割スタイルシートであることを表す。

__sample.scss

2.分割されたスタイルシートを呼び出す

分割スタイルシートを使う場合は、呼び出し側から @use を使って呼び出す。

上の __sample.scss を呼び出す場合、アンダーバー(__)と拡張子(.scss)の間にあるファイル名を文字列として指定して呼び出す。

@use 'sample';

3.sassコマンドを実行する

2. の呼び出し元のスタイルシートに対してsassコマンドを実行すると、生成されたcssファイルに、__sample.scss の内容が含まれる。