學過java的都知道馬士兵老師,他有一句口頭禪“穿二手鞋不如穿一手鞋”,一手鞋指的就是官方文檔。官方文檔看不懂,沒關系,先看這里,看完這里再去看官方。
官檔gulp.js中文網
理解gulp的特點
- 任務化:gulp通過創建和配置一個個任務(task),來啟動任務去構建前端項目
- 基于流 :gulp有自己的內存,在任務啟動時,gulp首先讀取(輸入流)文件到gulp內存,在gulp內存中進行操作(合并、壓縮等),然后輸出(輸出流)到本地。
- 異步(也可同步):gulp的任務不是同步執行的,它不需要等一個任務執行完再去啟動執行別的任務,這點下面會提到
gulp.src() //讀取文件到內存
gulp.dest()//輸出文件到本地
gulp.task()//注冊任務
第一個gulp任務
//在gulpfile.js中注冊一個任務
gulp.task('taskName',function(){
//配置任務的操作
})
啟動任務:在cli中輸入: gulp taskName taskName是你剛剛注冊的任務名
如果你的gulp任務很多的話,要一個一個去啟動很麻煩,這時可注冊默認任務,通過默認任務來啟動其他任務
gulp.task('default',['taskName1','taskName2'])
啟動默認任務只需在cli中輸入gulp
常用插件
gulp-concat 合并文件(js/css)
gulp-uglify壓縮js文件
gulp-rename文件重命名
gulp-less編譯less
gulp-clean-css壓縮css
gulp-livereload實時刷新