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タブ
## 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を起動
- ファイル(F) > プロジェクトプロパティ
- CSSプリプロセッサ
- Sassタブ
- CSSプリプロセッサ
と選択する。
- 右上の「実行可能ファイルを構成」ボタンを押すと「オプションダイアログ」が開くので
- "Sassパス"に、さっきの
node-sass.cmd
ファイルを指定 ...node-sassインストール先...\node_modules\.bin\node-sass.cmd
- 「OK」で確定
- "Sassパス"に、さっきの
- 元のダイアログ(プロジェクト・プロパティ)に戻って
- 保存時にSassファイルをコンパイル にチェックを入れる
- 入力・出力に、プロジェクトルートからのパスを入力
- コンパイラオプションを入力
--output-style expanded --source-map-contents --source-map-embed
「OK」ボタン押してダイアログ閉じると、自動にコンパイラが動いてcssが出力される!ハズ!
node-sassのコンパイラオプションは公式(GitHub)に乗ってます!
node-sass
Author And Source
この問題について(WindowsのNetBeansでSass自動ビルド (node-sass)), 我々は、より多くの情報をここで見つけました https://qiita.com/RyutaKojima/items/dd0fcff966c92ac9eac6著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .