Brackets で sass/scss ファイルを編集する際、保存時自動的に css に変換（コンパイル）する拡張機能に Brackets SASS があります。

以前に弊社ブログで紹介していた Koala を用いた方法でも可能ですが、こちらはエディタに統合されるので、Koala のようにプロジェクト毎に設定を追加する必要がありません。

Brackets SASS には sass/scss に変換するライブラリが同梱されていますので、プラグインのインストールだけで sass/scss の環境構築が可能です。

・・・が、私が使用している Windows10 (64bit版) では動作しませんでした。
※ なお brackets-sass は 2.0.3

調べてみるとひどく長いエラーメッセージが出ております。

Error: libsass bindings not found in C:\Users\username\Dropbox\.bin\.Develop\BracketsPortable\Data\home\AppData\Roaming\Brackets\extensions\user\jasonsanjose.brackets-sass\node\2.0.3\node_modules\node-sass\vendor\win32-ia32-48\binding.node. Try reinstalling node-sass? at Object.sass.getBinaryPath (C:\Users\username\Dropbox\.bin\.Develop\BracketsPortable\Data\home\AppData\Roaming\Brackets\extensions\user\jasonsanjose.brackets-sass\node\2.0.3\node_modules\node-sass\lib\extensions.js:148:11) at Object. (C:\Users\username\Dropbox\.bin\.Develop\BracketsPortable\Data\home\AppData\Roaming\Brackets\extensions\user\jasonsanjose.brackets-sass\node\2.0.3\node_modules\node-sass\lib\index.js:16:36) at Module._compile (module.js:570:32) at Object.Module._extensions..js (module.js:579:10) at Module.load (module.js:487:32) at tryModuleLoad (module.js:446:12) at Function.Module._load (module.js:438:3) at Module.require (module.js:497:17) at require (internal/module.js:20:19) at Object. (C:\Users\username\Dropbox\.bin\.Develop\BracketsPortable\Data\home\AppData\Roaming\Brackets\extensions\user\jasonsanjose.brackets-sass\node\2.0.3\render.js:39:12)

※ Brackets Portable を使用していますので、通常のパスとは若干異なっています

で、エラーメッセージを元にファイル関係を見てみると、存在しないファイルを参照していることが判明しました。
簡単な操作で正常に動作させることができたので下記に手順を掲載しておきます。

１．Brackets の 【ヘルプ】メニュー　→　【拡張機能のフォルダーを開く】の順にクリック。

２．エクスプローラが起動するので、下記の順にフォルダを開いていく。
【user】→ 【jasonsanjose.brackets-sass】 → 【node】 → 【2.0.3】 → 【node_modules】 → 【node-sass】 →  【vendor】

３．２の vendor フォルダ内に 【win32-ia32-48】というフォルダを作成する。

４．下記からファイルをダウンロードする。 ※ 画面を開いて Download ボタン
https://github.com/sass/node-sass-binaries/blob/master/win32-ia32-48_binding.node

５．ダウンロードしたファイルを 【binding.node】 にリネームする。

６．５のファイルを３で作ったフォルダ内に配置する。

７．Bracketsを再起動する。

手順は以上です。
あとは .scss などのファイルを作成して上書き保存するだけで自動的に css にコンパイルされます。

手順の概要を説明しますと、拡張機能の中に SASSファイルを css に変換するライブラリがOS毎に用意されているのですが、OSによっては必要なファイルがなかったようで手動で追加したという流れです。

なお この拡張機能をアップデートすると上記ファイルも無くなってしまう可能性がありますので、アップデート後に正常動作しなくなったらまたこの手順を行なってください。

参考URL: “cleanup” error appears after having updated Brackets · Issue #180 · jasonsanjose/brackets-sass · GitHub

2017/10/24現在最新版の brackets-sass 2.0.3 では win32-ia32-48 でしか動作しないようです。

今後バージョンアップがされた場合は、別途新しいバージョンのものを入手する必要があるかもしれません。https://github.com/sass/node-sass/releases に一覧がありましたので、最新版を取得したいならこちらから取得してください。

現在の最新版は win32-ia32-57 のようです。