一、gulp API 簡介
gulp 本身能做的事情非常少，主要是通過插件來提供各種功能，gulp 本身只提供了4個非常簡潔的 API, 掌握這4個 API 你就基本掌握了 gulp 的全部。
1、gulp.src(globs[, options])
2、gulp.dest(path[, options])
3、gulp.task(name[, deps], fn)
4、gulp.watch(glob [, opts], tasks) or gulp.watch(glob [, opts, cb])
二、gulp.src(globs[, options])
說明：返回當前指定文件流至可用插件。
globs：需要處理的源文件匹配符路徑。類型(必填)：String or StringArray。
通配符路徑匹配示例：
1、"src/index.js": 指定具體文件；
2、"{}": 匹配多個屬性。例：src/{a,b}.js(包含 a.js 和 b.js 文件) src/*.{jpg,png,gif}(包含 src 下的所有 jpg/png/gif 文件)；
3、"!": 排除指定文件。例：!src/index.js(不包含 src 下的 index.js 文件)；
4、"*.scss": * 號匹配當前目錄任意文件，所以這裏 *.scss 匹配當前目錄下所有 scss 文件；
5、"**/*.scss": 匹配當前目錄及其子目錄下的所有 scss 文件；
6、"*.+(scss|sass)": + 號後面會跟着圓括號，裏面的元素用 | 分割，匹配多個選項。這裏將匹配 scss 和 sass 文件;
options：類型(可選)：Object，有3個屬性 buffer、read、base。
1、options.buffer：類型：Boolean 默認：true 設置爲 false，將返回 file.content 的流並且不緩衝文件，處理大文件時非常有用；
2、options.read：類型：Boolean 默認：true 設置 false，將不執行讀取文件操作，返回null；
3、options.base：類型：String 設置輸出路徑以某個路徑的某個組成部分爲基礎向後拼接；
示例：
gulp.src(['js/*.js','css/*.css','*.html']) // 使用數組的方式來匹配多種文件
gulp.src(['src/*.js','!src/b*.js']) // 匹配所有js文件，但排除掉以 b 開頭的 js 文件gulp.src(['!src/b*.js','src/*.js']) // 不會排除任何文件，因爲排除模式不能出現在數組的第一個元素中
gulp.src('src/js/**/*.js', { base: 'src' }) // 保留 src 路徑後的所有路徑名稱
gulp.src(['less/**/*.less','!less/{extend,page}/*.less']) // 匹配 less 目錄下和子目錄下的所有 less 文件，但排除 less 目錄下 extend 和 page 目錄下的所有 less 文件
三、gulp.dest(path[, options])
說明：dest 方法是指定處理完後文件輸出的路徑。
path： 類型(必填)：String or Function 指定文件輸出路徑，或者定義函數返回文件輸出路徑亦可。
options：類型(可選)：Object，有2個屬性 cwd、mode。
1、options.cwd：類型：String 默認：process.cwd()：前腳本的工作目錄的路徑，只在所給的輸出目錄是相對路徑時候有效；
2、options.mode：類型：String 默認：0777 指定被創建文件夾的權限；
PS：我們給 gulp.dest() 傳入的路徑參數，只能用來指定要生成的文件的目錄，而不能指定生成文件的文件名，它生成文件的文件名使用的是導入到它的文件流自身的文件名，所以生成的文件名是由導入到它的文件流決定的，即使我們給它傳入一個帶有文件名的路徑參數，然後它也會把這個文件名當做是目錄名。要想改變文件名，可以使用 gulp-rename 插件。
示例：
// 最終生成的文件路徑爲 dist/foot.js/jquery.js，而不是 dist/foot.js
gulp.src('script/jquery.js')
.pipe(gulp.dest('dist/foot.js'));
// 最後生成的文件路徑爲 dist/**/*.js
// 如果 **/*.js 匹配到的文件爲 jquery/jquery.js ,則生成的文件路徑爲 dist/jquery/jquery.js
gulp.src('script/**/*.js') // 有通配符開始出現的那部分路徑爲 **/*.js
.pipe(gulp.dest('dist'));
// 最後生成的文件路徑爲 dist/avalon.js
gulp.src('script/avalon/avalon.js') // 沒有通配符出現的情況
.pipe(gulp.dest('dist'));
// 假設匹配到的文件爲 script/util/underscore.js
// 則最後生成的文件路徑爲 dist/util/underscore.js
gulp.src('script/**/underscore.js') // 有通配符開始出現的那部分路徑爲 **/underscore.js
.pipe(gulp.dest('dist'));
// 假設匹配到的文件爲 script/zepto.js
//則最後生成的文件路徑爲 dist/zepto.js
gulp.src('script/*') // 有通配符出現的那部分路徑爲 *
.pipe(gulp.dest('dist'));
//設該模式匹配到了文件 app/src/css/normal.css
// 用 dist 替換掉 base 路徑，最終得到 dist/css/normal.css
gulp.src('app/src/**/*.css') // 此時 base 的值爲 app/src,也就是說它的 base 路徑爲 app/src .pipe(gulp.dest('dist'));
// 假設匹配到的文件爲 script/lib/jquery.js
// 生成的文件路徑爲 build/jquery.js
gulp.src('script/lib/*.js') // 沒有配置 base 參數，此時默認的 base 路徑爲 script/lib
.pipe(gulp.dest('build'));
// 假設匹配到的文件爲 script/lib/jquery.js
// 此時生成的文件路徑爲 build/lib/jquery.js
gulp.src('script/lib/*.js', {base:'script'}) // 配置了 base 參數，此時 base 路徑爲 script
.pipe(gulp.dest('build'));
四、gulp.task(name[, deps], fn)
說明：task 方法定義一個 gulp 任務。
name：類型(必填)：String，指定任務的名稱（不應該有空格）。
deps：類型(可選)：StringArray，該任務依賴的任務（注意：被依賴的任務需要返回當前任務的事件流），爲一個數組。當前定義的任務會在所有依賴的任務執行完畢後纔開始執行。如果沒有依賴，則可省略這個參數。
fn：類型(必填)：Function，該任務調用的插件操作。
示例：
// 定義一個沒有依賴的任務
gulp.task('css', function () {
return gulp.src(['less/style.less'])
.pipe(less())
.pipe(gulp.dest('./css'));
});
// 定義一個有依賴的任務
gulp.task('mincss', ['css'], function () { // 執行完 css 任務後再執行 mincss 任務
return gulp.src(['css/*.css'])
.pipe(minifyCss())
.pipe(gulp.dest('./dist/css'));
});
// 定義一個有多個依賴的默認任務
gulp.task('default', ['css','concat','minifyCss']); // 只要執行 default 任務就相當於把 "css"，"concat"，"minifyCss" 這三個任務都執行了
五、gulp.watch(glob [, opts], tasks) or gulp.watch(glob [, opts, cb])
說明：watch 方法是用於監聽文件變化，文件一修改就會執行指定的任務。
glob：需要處理的源文件匹配符路徑。類型(必填)：String or StringArray。
opts：類型(可選)：Object，爲一個可選的配置對象，通常不需要用到。
tasks：類型(必填)：StringArray，需要執行的任務的名稱數組。
cb(event)：類型(可選)：Function 每個文件變化執行的回調函數。每當監視的文件發生變化時，就會調用這個函數,並且會給它傳入一個對象，該對象包含了文件變化的一些信息，type 屬性爲變化的類型，可以是 added, changed, deleted；path 屬性爲發生變化的文件的路徑。
示例：
gulp.task('watch-less', function () {
gulp.watch('less/**/*.less', ['css']);
});
gulp.task('watch-js', function () {
gulp.watch('js/**/*.js', function (event) {
// 輸出發生改變文件的一些信息
console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
});
});