Roroa.

こんにちは、kazukiです。
今回は最近知ったsassの記述方法をメモしておきたいと思います。

ディレクトリ構造は
assets/sass/ にsassファイルを
assets/css/ にcssをファイルを格納している形、別ディレクトリになっている場合で説明します。

ちなみに、以降はターミナルでassets/sass/に移動している前提で説明していきます。

1つのディレクトリやファイルに対して

sassを使う時「koala」という便利なアプリを使うことが多いのですが、ターミナルを使うこともあります。
そんな時、大体ディレクトリに対して監視をするか、1ファイルに対して監視をしています。

ディレクトリに対してsassで監視する

sass --watch input:../css/

ファイルに対してsassで監視する

sass --watch top.scss:../css/top.css

複数のファイルをsassで監視する

次はディレクトリ構造が少し変わり、sassのファイルの場所は変わらすアウトプット先がcommonとpagesで分かれている場合で説明します。

assets/sass/ sassのファイル
assets/css/common/common.css
assets/css/pages/top.css こんな感じに分かれている

sass複数監視のターミナル記述方法

sass --watch top.scss:../css/pages/top.css common.scss:../css/common/common.css

簡単ですね！ファイルに対してsassで監視するやり方と同じで、そこにスペースを空けて条件を加えていけば良いです。
実際に走らせてみても問題なく動いてくれました。