パーツや役割ごとにSassファイルを分けておくことで、ファイルの管理がしやすくなります。
今回は、複数のSassファイル（scss）を最終的にCSSに出力する際に1つにする方法を紹介します。
Sassファイルを分割して管理する方法
さてではSassの分割して管理する方法を血盟する前にメリットを書いてみます。
分割するメリット
ページ数の多い中規模、大規模サイトでは、ファイルを分割しておくことでメンテナンス性が向上します。
Sassは、複数に分割しても１つのCSSにまとめてコンパイルすることができるので管理時は分割ファイルで、サイトへの読み込みは１つのファイルでと割り切って作業できます。
複数のCSSを読み込む必要がないのでファイルの読み込み数も増やすことなく管理のしやすい構成が可能になります。
SCSSファイル作成
SCSSでは、ファイル名の先頭に「_」をつけると分割ファイルとして作成することができます。
今回の様にページ毎に分割する際は必ず「_○○.scss」にしましょう。
設計については「吉本式BEM設計（BEM設計ベース）」さんの「SCSSのファイル設計について Vol.1」などを参考にすると良いかと思います。
複数ファイルを読み込む
今回は練習として「matome.scss」（ファイル名は任意）に全て読み込むとします。
「matome.scss」に下記コードを記述。
[css]
@import "header";
@import "footer";
[/css]
「_○○.scss」の「_」は省略できるので、「〇〇」内のみ入力します。
上記の読み込みファイル「_header.scss」、「_footer.scss」。
これをコンパイルすると、「matome.css」に全てのCSSが出力されます。
ABOUT ME
