SCSS使うと普通にCSS書くのはめえんどくせー
たまに忘れるので、ちょっと自分用にメモ。
今回はページ毎にSCSSファイルを作成して、最終的に１つのファイル（CSS）にして管理しやすくする方法です。
SCSS１つのファイルで全てのページのソースを書くことも可能ですが、重くなるし、長くなるし、複数人で作業するのにも不便。
そんな時はページ毎にファイルを分割して管理してみるはいかがでしょうか。
分割するメリット
ページ数の多い中規模、大規模サイトでは、ファイルを分割しておくことでメンテナンス性が向上します。
Sassは、複数に分割しても１つのCSSにまとめてコンパイルすることができるので管理時は分割ファイルで、サイトへの読み込みは１つのファイルでと割り切って作業できます。
複数のCSSを読み込む必要がないのでファイルの読み込み数も増やすことなく管理のしやすい構成が可能になります。
SCSSファイルを作成
SCSSでは、ファイル名の先頭に「_」をつけると分割ファイルとして作成することができます。
今回の様にページ毎に分割する際は必ず「_○○.scss」にしましょう。
@importで複数のファイルを読み込む
今回「matome.scss」（ファイル名は任意）に全て読み込むとします。
「matome.scss」に下記コードを記述。
@import "header"; @import "footer";
「_○○.scss」の「_」は省略できるので、「〇〇」内のみ入力します。
上記の読み込みファイル「_header.scss」、「_footer.scss」。
あとはコンパイルするだけ！
ABOUT ME
