現状自分のマスト環境になっているWebStormでのSassの利用についてまとめます。
まずはnode.jsとGruntの準備から。
Sassはこれらを使って動くためです。
前提
- WebStormインストール済み
- WebStormでSassを利用したいプロジェクトを開いた状態
node.jsをインストール
http://nodejs.org/ まずnode.jsをインストールしましょう。
次にWebStormのTerminalより、下記コマンドを打ってください。
node -v
下記のようにバージョン数が出たらOKです。
v0.10.32
Rubyをインストール
http://rubyinstaller.org/
Windowsであれば上記よりインストーラーをダウンロードできます。
node.jsの時と同様にTerminalから下記コマンドを打ってください。
ruby -v
下記のようにバージョン数が出たらOKです。
ruby 2.1.3p242 (2014-09-19 revision 47630) [x64-mingw32]
Gruntをインストール
下記コマンドを打ちGruntをインストールします。
npm install -g grunt-cli
次に下記コマンドを打ちます。
npm init
下記の順の対話型で入力を求められます。
name: {プロジェクト名}
version: (Enterで飛ばす)
description: (Enterで飛ばす)
entry point: Gruntfile.js
test command: (Enterで飛ばす)
git repository: (Enterで飛ばす)
keywords: (Enterで飛ばす)
author: (Enterで飛ばす)
license: (Enterで飛ばす)
Is this ok? (EnterでOK)
入力後、プロジェクトフォルダ内に package.json が作られます。
上記で書いた内容が反映されています。
次に下記コマンドを打ちます。
npm install grunt --save-dev
プロジェクト内に node_modules というフォルダが作られ、このプロジェクト専用のGrunt用ファイルがインストールされます。
