經(jīng)常瀏覽一下gulp中文網(wǎng)
優(yōu)勢(shì):
易于使用
通過(guò)代碼優(yōu)于配置的策略姆打,Gulp 讓簡(jiǎn)單的任務(wù)簡(jiǎn)單额湘,復(fù)雜的任務(wù)可管理谴垫。
構(gòu)建快速
利用 Node.js 流的威力,你可以快速構(gòu)建項(xiàng)目并減少頻繁的 IO 操作蜡镶。
插件高質(zhì)
Gulp 嚴(yán)格的插件指南確保插件如你期望的那樣簡(jiǎn)潔高質(zhì)得工作。
易于學(xué)習(xí)
通過(guò)最少的 API恤筛,掌握 Gulp 毫不費(fèi)力官还,構(gòu)建工作盡在掌握:如同一系列流管道。
Gulp安裝
- 全局安裝 gulp:
$ npm install --global gulp
- 全局安裝 gulp:
- 作為項(xiàng)目的開(kāi)發(fā)依賴(devDependencies)安裝:
$ npm install --save-dev gulp
- 作為項(xiàng)目的開(kāi)發(fā)依賴(devDependencies)安裝:
- 在項(xiàng)目根目錄下創(chuàng)建一個(gè)名為 gulpfile.js 的文件:
var gulp = require('gulp'); gulp.task('default', function() { // 將你的默認(rèn)的任務(wù)代碼放在這 });
- 在項(xiàng)目根目錄下創(chuàng)建一個(gè)名為 gulpfile.js 的文件:
- 運(yùn)行 gulp:
$ gulp
- 運(yùn)行 gulp:
5.安裝sass插件:
$ npm install gulp-sass
Glup將輸入的文件轉(zhuǎn)換成內(nèi)存流
gulp 技巧集
- 整合 streams 來(lái)處理錯(cuò)誤
- 刪除文件和文件夾
- 使用 watchify 加速 browserify 編譯
- 增量編譯打包毒坛,包括處理整所涉及的所有文件
- 將 buffer 變?yōu)?stream (內(nèi)存中的內(nèi)容)
- 在 gulp 中運(yùn)行 Mocha 測(cè)試
- 僅僅傳遞更改過(guò)的文件
- 從命令行傳遞參數(shù)
- 只重新編譯被更改過(guò)的文件
- 每個(gè)文件夾生成單獨(dú)一個(gè)文件
- 串行方式運(yùn)行任務(wù)
- 擁有實(shí)時(shí)重載(live-reloading)和 CSS 注入的服務(wù)器
- 通過(guò) stream 工廠來(lái)共享 stream
- 指定一個(gè)新的 cwd (當(dāng)前工作目錄)
- 分離任務(wù)到多個(gè)文件中
- 使用外部配置文件
- 在一個(gè)任務(wù)中使用多個(gè)文件來(lái)源
- Browserify + Uglify2 和 sourcemaps
- Browserify + Globs
- 同時(shí)輸出一個(gè)壓縮過(guò)和一個(gè)未壓縮版本的文件
- 改變版本號(hào)以及創(chuàng)建一個(gè) git tag
- Swig 以及 YAML front-matter 模板