2017年2月5日 星期日

前端攻城屍自動化教學 2 ( gulp 安裝篇)

大家好,我是奶綠茶
上一篇介紹了現成的前端工具 prepros
但總是有些功能無法滿足
這篇就來介紹純手工的前端自動化工具 gulp
gulp 的官網一進去就會看到大大的
Automate and enhance your workflow
http://gulpjs.com/

1.
首先要安裝 npm (nodejs package manager)
安裝 nodejs 就會有 npm 的功能
https://nodejs.org/en/
測試一下是否正常
進入終端機模式(Terminal)
輸入
node -v
是否有出現版本號
再輸入
npm -v
是否有出現版本號


2. 安裝 gulp
以下教學參考官方的原文
https://github.com/gulpjs/gulp/blob/master/docs/getting-started.md
npm install --global gulp-cli
--global 指的是全域應用,也可以縮寫 -g

3. 開啟你的專案資料夾,並啟動 Terminal, 輸入
npm init
之後一直接 entry , entry , entry .....
就會產生一隻 package.json
裡面記錄了這個專案會用到的各種套件

4.安裝 gulp 到 devDependencies
npm install --save-dev gulp
--save-dev 可以縮寫成 -s -D
打開 package.json
可以看到 devDependencies 多了 gulp : xxx 版本號
測試一下是否運作正常
gulp
轉載請註明出處

沒有留言: