一虐秦、gulp介紹及用法
1. 介紹
gulp是一個自動化構(gòu)建工具府寒，可以幫助開發(fā)者構(gòu)建整個項目流程中的自動化部分，比如less伤提、sass的編譯巫俺，這樣做可以節(jié)省開發(fā)者很多時間，集中精力做業(yè)務(wù)上等其他重要的事兒肿男。
2. 基本用法
2.1 gulp可執(zhí)行文件
一般命名為gulpfile.js识藤，作為構(gòu)建入口文件
2.2 安裝
gulp官中API：點此鏈接
gulp以及gulp插件地址： 點此鏈接砚著，可使用國內(nèi)鏡像cnpm
npm參數(shù)：-g表示全局安裝，--save-dev(或-D)表示安裝到devDependencies(只用于開發(fā)環(huán)境痴昧，不會發(fā)布到生產(chǎn)環(huán)境)稽穆，--save(或-S)表示安裝到dependencies(會發(fā)布到生產(chǎn)環(huán)境)
npm install gulp -g 或 npm install gulp -D
2.3 使用
const gulp = require('gulp');
2.4 五個常用API
常用示例：gulp.src('./**',{base: ''})豪娜，可以匹配到base指定路徑并輸出
- gulp.pipe(fn())：pipe會輸出經(jīng)過fn()處理的輸入到pipe的stream餐胀。
常用示例：gulp.src('./*/.less').pipe(less())，會把匹配到的less文件編譯為css文件瘤载，并輸出stream
- gulp.dest(path[,opts])：會把gulp.src(globs)匹配到的文件經(jīng)過中間一系列stream處理后生成文件到指定path否灾。
常用示例：gulp.src('./*/.less').pipe(less()).pipe(gulp.dest('./dist'))
- gulp.task(name[,deps],callback)：自定義任務(wù)，name表示任務(wù)名鸣奔，deps表示執(zhí)行回調(diào)callback函數(shù)前先執(zhí)行的任務(wù)墨技。輸入gulp命令默認(rèn)執(zhí)行'default'任務(wù),callback可接受返回callback,stream, promise
常用示例：gulp.task('custom',['browersync'],function(){})
- gulp.watch(glob[,opts],tasks),gulp.watch(glob[,opts],callback) 兩種形式：可以監(jiān)控glob匹配到的文件或目錄，根據(jù)變化作出相應(yīng)事件(added, changed 或者 deleted)響應(yīng)
常用示例：var watcher = gulp.watch('./*/.js', ['uglify','reload'])
watcher.on('change',callback)
