1、建立package.json檔案

npm init

2、安裝gulp、gulp-connect

npm install --save-dev gulp gulp-connect

3、建立gulpfile.js檔案並引入gulp、gulp-connect

var gulp = require('gulp');  // 本地、全域性都要安裝
var connect = require('gulp-connect');

//建立“更新”任務
gulp.task('html', function(done) {
  gulp.src('./*.html').pipe(connect.reload())
  done()
})

// 建立監聽任務
gulp.task('watch', function(done) {
  gulp.watch("./css/*.css", gulp.parallel('css'));
  gulp.watch("./*.html", gulp.parallel('html'));
  done()
})

// 建立connect.server服務
gulp.task('connect', function(done) {
  connect.server({
    livereload: true
  })
  done()
})

//gulp不能同時執行兩個任務，所以這裡加到預設任務裡面
gulp.task('default', gulp.series('connect', 'watch', done => done()))
 


PS：一定要記得加上done引數和後面的done()執行，不然會導致後面的任務堵塞(“任務堵塞” —— 自己起的名字,個人理解是：如果不加上，每個任務在執行結束後不會主動告訴gulp當前任務執行結束了，
可以去執行後續的任務了，這樣就會造成後續的任務得不到執行，服務一直卡在那裡，因為當前任務一直處於starting狀態)

　　4、完成後，執行gulp即可實現一鍵啟動專案和瀏覽器熱載入，告別F5