- Ruby SassはBootstrapとかコンパイルすると遅すぎて辛い
- Lessは速いけどインデントで書きたい(curly braceを書きたくない)
- StylusはBootstrapが公式にサポートしてない(個人的に使ったことない)
.sass
で書きたい。
環境
- gulp 3.8.10
- gulp-sass 1.3.2
2015/1/30更新。
node-sass
のアップデートに伴ってgulp-sass
のバージョンも上がり、以前と対策方法が変わっています。以前の内容は更新履歴を見てください。
普通に.sass
を渡すとコケる
g = require 'gulp'
sass = require 'gulp-sass'
g.task 'default', ->
g.src './style.sass'
.pipe sass()
.pipe g.dest './'
このままだとコンパイルできない。.sass
という拡張子でも.scss
として解釈される。インデントスタイルのシンタックスでコンパイルするには、
If you want to use the indented syntax (
.sass
) as the top level file, usesass({indentedSyntax: true})
.
https://github.com/dlmanning/gulp-sass/blob/master/README.md
とのことです。つまり
g = require 'gulp'
sass = require 'gulp-sass'
g.task 'default', ->
g.src './style.sass',
.pipe sass
indentedSyntax: true
.pipe g.dest './'
で.sass
ファイルをコンパイルできます。
ただ、https://github.com/dlmanning/gulp-sass/pull/181がマージされれば拡張子をチェックして自動でindentedSyntax
オプションを振ってくれるようになるので特別にオプションを設定することなく.sass
ファイルもコンパイルできるようになると思います。
そうなればこの記事も不要になるので、確認次第こちらも更新いたします。
Libsassはコンパイルが早くて素晴らしいけど……
LibsassはRubySassに対してコンパイルが速い点以外の優位性はないので、Rubyが死ぬほど嫌いでRubyをインストールしたくない人以外で、速度が気にならない人はgulp-ruby-sassを使うといいでしょう。あっちはcompass
も使えるしね。