Sass のアップデートでググることが何回かあったので、まとめておきます。それと、導入の方法も忘れてたので一緒に記述。あとで見て何書いてあるか思い出せるように、丁寧に書いておきます。
※Mac ユーザーなので、Ruby のインストールは割愛です、ごめんなさい。
Sass 準備
全部、Terminal での作業になります。
Ruby のバージョン確認
$ ruby -v
Ruby のアップデート
$ sudo gem update --system
Sass のインストール
$ sudo gem install sass
Sass のバージョン確認
$ sass -v
Sass のアップデート
$ sudo gem update sass
Sass 導入
sassディレクトリの準備
作業する用のディレクトリの下に、sassディレクトリを作成。ディレクトリ名は「scss」でもok。
scssファイルを作成
作成したディレクトリに、.scssファイルを作成
作業する用のディレクトリのルートへ移動
Terminal 上で、pwd(現在のディレクトリ確認)とcd(ディレクトリ移動)を駆使する
ファイルの監視を開始して完了
$ sass --watch sass:css
出力スタイルの指定
公式のドキュメント見れば事足りるけど、一応書いておきます。
元の.scssファイル
header { width: 100%; h1 { font-weight: bold; } }
:nested
$ sass --watch sass:css --style nested
header { width: 100%; } header h1 { font-weight: bold; }
:expanded
$ sass --watch sass:css --style expanded
header { width: 100%; } header h1 { font-weight: bold; }
:compact
$ sass --watch sass:css --style compact
header { width: 100%; } header h1 { font-weight: bold; }
:compressed
$ sass --watch sass:css --style compressed
header{width:100%}header h1{font-weight:bold}
このくらい丁寧に書いておけば、後で読み返してもわかるはずー。