アウトプットスタイルを指定してSassファイルをCSSにコンパイルする

SassコマンドにStyleオプションを指定して、アウトプットスタイルを適宜変更する。

Nested Style

$ sass --watch --style nested sass:css

Sassの階層をインデントを使って残すため、ネストされているような見た目になる。 Styleオプションを指定しないと、デフォルトでNestedスタイルで書き出される。

Expanded Style

$ sass --watch --style expanded sass:css

ルールセットとプロパティを1行ずつ改行して、書き出される。一番見やすそう..

Compact Style

$ sass --watch --style compact sass:css

ルールセットごろに改行して、書き出される。
※異なるネストグループは一行空けて次の行に。

Compressed Style

$ sass --watch --style compressed sass:css

サイズの軽量化を最優先するので、インデントや改行がなく、通常のCSSのコメントも削除される。



ちなみにSassファイルは以下。(SASS記法)