1.環境準備
需要安裝Git、Node、Bower、Grunt、Ruby
NodeJS https://nodejs.org/en/
Ruby http://rubyinstaller.org/downloads/archives
2.安裝配置檢查
下載上面的軟體，然後點選連續點選下一步進行安裝，安裝後看“系統環境變數”Path中是否存在“C:\Ruby23-x64\bin”與“C:\Program Files\Git\cmd”，沒有則新增，Nodejs一般在安裝時就會自動添回到系統變數中，然後驗證安裝結果
node -v npm -v ruby -v
3.安裝Grunt
npm install -g grunt-cli
4.安裝Grunt外掛
npm install grunt-contrib-sass grunt-contrib-uglify grunt-contrib-watch --save-dev
注：--save-dev自動完善package.json
grunt-contrib-sass #sass編譯外掛
grunt-contrib-uglify #js壓縮外掛
grunt-contrib-watch #監控外掛
5.安裝Bower
npm install -g bower
6.常見錯誤分析
6.1.1 使用sass報You need to have Ruby and Sass installed and in your PATH for this task to work錯誤
Running "sass:dist" (sass) task Warning: You need to have Ruby and Sass installed and in your PATH for this task to work. More info: https://github.com/gruntjs/grunt-contrib-sass Use --force to continue.
原因說明：沒有安裝ruby環境，並且需要安裝一下sass，安裝sass過程如下
如果下載被牆了，要改一下修改源地址
$ gem sources --add https://gems.ruby-china.org/ --remove https://rubygems.org/
再執行下面的命令
gem install sass
--驗證 sass -v sass -h --安裝Sass npm install grunt-contrib-sass --save-dev --執行編譯命令 grunt sass
Running "sass:build" (sass) task Error: Invalid GBK character "\xE7" on line 2 of app/src/sass/style.scss Use --trace for backtrace. Warning: Exited with error code 13 Use --force to continue.
6.1.2 scss檔案編譯時候使用ruby環境，出現 Syntax error: Invalid GBK character "\xE5"
檢查了好久才發現 scss編譯不支援中文字型，進入到ruby安裝目錄
C:\Ruby23-x64\lib\ruby\gems\2.3.0\gems\sass-3.4.23\lib\sass
修改 engine.rb?檔案?
在require 最下面 加入以下程式碼 即可解決
Encoding.default_external = Encoding.find('utf-8')