SublimeTextでのsass・compass自動コンパイル

More than 3 years have passed since last update.

先日、OS X 10.11 El CapitanのMac Book Proをもらった。

Win→Mac への移行でちらほら覚え書き。

ズボラなので、SublimeTextでの自動コンパイルMacに導入。

⌘+Sで上書き保存すると勝手にsass→cssでコンパイルしてくれるんだ!

<1>

SublimeText3をダウンロード

https://www.sublimetext.com

<2>

Package Control機能をつける

(↑いろいろダウンロードするための機能をつける)

http://futago-life.com/sublime-text3-wiki/first-step/install/package-control

※わかりやすい参考サイト

<3>

Shift+⌘+Pでテキストボックスが出てくるのでInstall Packageを入力して以下のパッケージをDL

・Sass

・SASS Build

・SCSS

・Compass

最後に保存したらコンパイルするパッケージを入れる

・SublimeOnSaveBuild

すると、自動でコンパイルされるように・・・・!なるはずが、ならなかった。

自動コンパイルはされてるんだけど、どうにもcompassのconfigを読んでない様子。

sassでコンパイルされてるみたい。

調べたら、Macでcompass自動コンパイルを有効にするにはコンパイル(ビルド)の設定をちょっと書き換えないとならないらしい。

Shift+⌘+Pでlist Packages→compass(クリックでフォルダ開く)→Compass.sublime-buildに↓を追加


filename

"osx": {

"path": "/usr/local/bin:/Users/USERNAME/.rbenv/shims:$PATH"
},

私のビルドファイルの設定↓


filename

{

"osx": {
"path": "/usr/local/bin:/Users/matsupome/.rbenv/shims:$PATH"
},
"cmd": "sh '${packages}/Compass/build.sh' '${file_path}' '${project_path:${folder}}'",
"working_dir": "$packages/Compass",
"selector": "source.sass, source.scss",
"shell": "true",
"windows":
{
"cmd": "build.cmd \"${file_path}\" \"${project_path:${folder}}\""
}
}

ビルドファイルを書き換えるとcompassでの自動コンパイルがされるようになる。

ターミナル立ち上げる必要もなく、koalaみたいなコンパイルソフト立ち上げる必要もなく、上書き保存するだけでコンパイルされる!

すっごい快適!