別のSASSファイルの読み込み

別のSASSファイルの読み込みを行うには、@importルールを使用します。

ファイル名の指定は、拡張子を省略することができます。
また、カンマ区切りで指定することで1度に複数のファイルを読み込むことができます。

複数のSASSファイルを読み込んでいる場合、コンパイルするとそれぞれのファイルが生成されます。
必要のないSASSファイルをコンパイル時に生成させたくない場合は、アンダースコアを先頭に付けることで生成されなくなります。
なお、@importで指定するファイル名にはアンダースコアを省略することができます。

構文

							単数:
							@import "ファイル名";
							複数:
							@import "ファイル名", "ファイル名"...;
						

サンプルコード

SCSS

CSSの読み込みで@importをSASS内で使用する場合

CSSの読み込みで@importをSASS内で使用する場合は、拡張子を省略せずに指定することで@importをコンパイル後でも使用することができます。

SCSS

コンパイル後:CSS

SASS・SCSS逆引きリファレンス一覧へ戻る