- 1. 概要
- 2. 環境構築
1. 概要
やっと CSS に慣れてきたと思っていましたが、2006年には、もう SASS ってのが登場していたんですな。
と、この記事を書いているのが 2017年10月16日なので、ほぼ、10年遅れ・・・。
ともあれ、便利そうなので少し勉強してみます。
詳細は「ウィキペディア - SASS」をご覧いただくとして。
とりあえず、.sass は、わたしにとって文法が厄介なので、もっぱら .scss の方を使おうと思います。
だって、改行やインデントに意味を持たせる文法って、なじめないのです。
参考サイトは以下になります。
「CSSのメタ言語Sass(SCSS)、LESSの完全入門」
「（Macで）Sassのコンパイル、基本のアレコレをざっくりと」
リンク切れのサイトからの孫引きになりますが「CSSだけを使っている “No Preprocessor” の割合は約15%となっており、約85%は何らかのCSSプリプロセッサーを使っているようです。」ってのはちょっと衝撃（笑劇？）ですな。
2. 環境構築
環境構築というほど大袈裟なものではなく、sass という、.scss のコンパイラをいれるだけのことですが・・・。
はじめて、ruby の gem というのを使ってみるのでちょっとドキドキ。
そもそも gem がはいっていなければ
プロンプト略
whereis rubygem-gems
rubygem-gems: /usr/ports/devel/rubygem-gems
cd /usr/ports/devel/rubygem-gems
make
make install
インストールしたら
> gem install sass
Fetching: rb-fsevent-0.10.2.gem (100%)
Successfully installed rb-fsevent-0.10.2
Fetching: ffi-1.9.18.gem (100%)
Building native extensions. This could take a while...
Successfully installed ffi-1.9.18
Fetching: rb-inotify-0.9.10.gem (100%)
Successfully installed rb-inotify-0.9.10
Fetching: sass-listen-4.0.0.gem (100%)
Successfully installed sass-listen-4.0.0
Fetching: sass-3.5.3.gem (100%)
Successfully installed sass-3.5.3
Parsing documentation for rb-fsevent-0.10.2
Installing ri documentation for rb-fsevent-0.10.2
Parsing documentation for ffi-1.9.18
Installing ri documentation for ffi-1.9.18
Parsing documentation for rb-inotify-0.9.10
Installing ri documentation for rb-inotify-0.9.10
Parsing documentation for sass-listen-4.0.0
Installing ri documentation for sass-listen-4.0.0
Parsing documentation for sass-3.5.3
Installing ri documentation for sass-3.5.3
Done installing documentation for rb-fsevent, ffi, rb-inotify, sass-listen, sass after 29 seconds
5 gems installed
なんということもなくインストールされました。
> whereis sass
sass: /usr/local/bin/sass
> sass -v
Sass 3.5.3 (Bleeding Edge)
|
|
