Zi 字媒體

此篇文章瀏覽量： 256 Gulp 是一個在前端開發領域中，非常好用的一個任務管理系統，你可以建立多個任務(Tasks)，來創造 Build System，像是將 css 的 sass 檔案編譯成 css 檔，就是一個任務(Task)；將所有前端檔案做版本化管理也是一個任務(Task)。算是我非常喜歡的一個前端工具。 官網在這：Gulp 這裡列出基本的指令以及一開始在專案中該如何導入： 移除全域的 Gulp 如果之前曾經在全域安裝過的話，想要移除，可以透過以下指令： $ npm rm --global gulp 安裝全域 Gulp $ npm install --global gulp-cli 檢查版本 $ gulp -v 建立 package.json 檔案 先建立一個空的測試用專案目錄： test_gulp_proj，再透過 npm init 指令來建立 package.json 檔： $ mkdir test_gulp_proj $ cd test_gulp_proj $ npm init 在專案資料夾中，安裝 gulp $ npm install --save-dev gulp 在專案資料夾中，檢查版本 $ gulp --version 就會看到下圖： CLI version 就是全域安裝的 gulp-cli 版本Local version 就是目前專案資料夾中所安裝的 gulp 版本 手動建立 gulpfile.js 檔案 直接在專案資料夾當中，建立 gulpfile.js 檔案，所有的任務管理，都是在這個檔案當中。 建立一個預設的任務 在 gulpfile.js 檔中，放入以下內容，defaultTask() 函式並沒有做任何的動作，只是將它設定成一個預設的任務函式： function defaultTask(cb) { // place code for your default task here cb(); } exports.default = defaultTask 執行任務 直接在專案資料夾之中，執行 gulp 指令，就會按照 gulpfile.js 當中的設定來執行： $ gulp 若覺得文章有幫助，請多分享，讓其他同好也能吸收網站技能知識。 Facebook Twitter