Sassの流れでcompass

Kameです。

Sassからの流れでcompassを触ってみましたが、少し触って「ちょっと使い辛いな」と思い封印してきました。
しかしよくよく考えてみると便利なところもあるなと思ったのでもう一度調べてみることにしました。
その中で自分なりに思ったメリット・デメリットをつらつら書いていこうと思います。

compass create

ターミナル上で

compass create

コマンドを実行すると現在のディレクトリに自動的にSassでCSSを書いていく際のディレクトリ・ファイルが生成されます。

├── config.rb
├── sass
│   ├── ie.scss
│   ├── print.scss
│   └── screen.scss
└── stylesheets
    ├── ie.css
    ├── print.css
    └── screen.css

デフォルトでは上記のような形です。

このディレクトリ名はオプションやcreateで一緒に生成されるconfig.rbの設定で変更できるのですが、この辺りが少し使い辛いなーと感じてしまいました。
チームでcompassを利用していく際はconfig.rbを共有して使い回すのがよろしいかと。

compass watch

Sassだけでscssファイルをwatchする場合は

sass --watch sass -t expanded

のようにコマンドを実行しなければならないですが、compassの場合はconfig.rbでディレクトリと吐き出すスタイルを設定しておけば

compass watch

だけでwatchさせることができます。
こちらは地味にいい機能。

様々なimport

Mixin等を社内で作って共有していく動きもありますが、Compassの場合は様々よく使うようなものをデフォルトで用意してくれています。CSS3系、ユーティリティ系等々・・・
後はそれらをscssファイル内で

@import "hoge"

してやれば使えるようになります。importできるものはこちらあたりに書かれているようです。

ただしこちらも便利と言えば便利なのですが、resetやclearfixなどを利用する場合は用意されているものが個人の好みに合うかどうかが問題です。
僕としてはあまり気に入らないものが多かったため、自分たちで用意したものを使うのが良いかと思いました。

まとめ

config.rbをあらかじめ用意しておいてcreateしてwatchするのは便利だなと思うのですが、用意されているMixin系があまり魅力的ではなかったため「よしcompassやるぞ!」とはなれませんでした。
Mixinなどはcompassのを参考に自分たちでカスタマイズするのがいいと思います。

ただ今回調べてみますと他にも便利そうな機能が様々ありそうだったので、今後も調査続行です。