監看事件

你可能有發現，修改檔案後都要再自行手動執行一次任務，好像還是有點不便捏～～～那是因為我們還有一個蠻重要的小撇步還沒設定，就是 gulp.watch()。

gulp.watch 用法

這是 gulp 內建的功能，用來監看檔案，每當檔案有異動時，gulp 就會自動執行相對應的任務

gulp.task('watch', function() {
  gulp.watch('src/*.html', ['html']) //監看所有 html 檔案，檔案有更動時就執行 task html
  gulp.watch('src/css/*.css', ['style'])  //監看所有 css 檔案，檔案有更動時就執行 task style
  gulp.watch('src/js/*.js', ['script']); //監看所有 js 檔案，檔案有更動時就執行 task script
});

執行

gulp watch

試試看，當更動 src 裡的 html 檔案按儲存後，gulp 是不是自動執行任務 html了呢？