WindowsのNetBeansでSass自動ビルド (node-sass)

TIPS

node-sassの実行ファイルの指定は、NetBeansの設定（全プロジェクト共通）になってしまうので、プロジェクト外にインストールした方がよさそうです

前準備

nodeインストールまで終わっていて、npmが使える前提です。
　まだの場合先にこちら → Windowsでnodistを使ってNode環境構築

npm -v
> 4.0.5

必要なものをインストール

## node-sassをインストールするディレクトリに移動 
cd C:\node-sassインストール先パス

## npmの初期化(すでに終わっているなら必要ないです)
npm init -y

## node-sassをインストール
npm install --save-dev node-sass

カレントディレクトリのnode_modules以下にファイルが出来ているのを確認する
node_modules.bin\node-sass.cmd

NetBeansの設定

• NetBeansを起動
• ファイル(F) > プロジェクトプロパティ
  • CSSプリプロセッサ
    • Sassタブ

と選択する。

今こんな画面(デフォルト設定)

• 右上の「実行可能ファイルを構成」ボタンを押すと「オプションダイアログ」が開くので
  • "Sassパス"に、さっきのnode-sass.cmdファイルを指定
  • ...node-sassインストール先...\node_modules\.bin\node-sass.cmd
  • 「OK」で確定

• 元のダイアログ(プロジェクト・プロパティ)に戻って
  • 保存時にSassファイルをコンパイル にチェックを入れる
  • 入力・出力に、プロジェクトルートからのパスを入力
  • コンパイラオプションを入力
    --output-style expanded --source-map-contents --source-map-embed

全部入力が終わった画面

「OK」ボタン押してダイアログ閉じると、自動にコンパイラが動いてcssが出力される！ハズ！

node-sassのコンパイラオプションは公式（GitHub)に乗ってます！
node-sass