2014-04-10

Grunt.js 入門講義

●● Grunt 入門   ◎ 林新德 編 ( shinder.lin@gmail.com ) 2014.4 

● Grunt ( http://gruntjs.com/ )
名稱來自於 grunt work (單調的工作),它的功能是使用設定來執行常做的動作,例如最小化 JavaScript 和 CSS 檔等。


● Grunt 在 0.3 版時提供常用的功能,設定檔使用 grunt.js。到 0.4 版時做了些調整,使用外掛的架構,設定檔為 Gruntfile.js。


● 本講義以 Windows 7 為作業系統為例,各軟體的安裝皆在 Windows 7 底下安裝,請注意使用的軟體版本,例如 NodeJS 有 32-bit 和 64-bit 之分。
◎ Windows Command Prompt 使用 PowerShell
◎ 範例專案 shinder_maze.zip 和 shinder_circle_menu.zip  (** blog 不提供專案包 zip 檔 )

● Web server,使用 Python3 內建的簡易 web server ( 非必要 )
在 Command prompt,到專案目錄使用下式啟動 server
> python -m http.server [埠號]
使用「Ctrl + C」停止 server

● 在安裝 Grunt 之前需先安裝 Git 和 NodeJS

◎ 1. NodeJS ( http://nodejs.org/ )
– 直接從官網按「 INSTALL 」,下載 msi 檔並安裝。

◎ 2. Git
– 安裝 Git for Windows ( http://git-scm.com/download/win )
– 安裝過程中請勾選「Run Git from the Windows Command Prompt」

FB 留言