如何設置 gulp 文件以進行實時重新加載

Question

我正在嘗試添加幾個 gulp 任務。 我有一個基本的 HTML 站點，我想查看更改並重新加載更新的更改。 我正在嘗試使用 livereload 來收聽和更改。 但是，當它重新加載時，我收到一個錯誤，表明該端口已在使用中，這是有道理的。 但我找不到解決方案。 第一次使用 Gulp 所以歡迎任何關於讓我做得更好的提示

    var gulp = require('gulp');
var livereload = require('gulp-livereload');
var rev = require('gulp-rev');
var clean = require('gulp-rimraf');
var runSequence = require('run-sequence').use(gulp);
var connect = require('gulp-connect');

gulp.task('build', function () {
  // by default, gulp would pick `assets/css` as the base,
  // so we need to set it explicitly:
  return gulp.src(['assets/css/*.css','assets/css/**/*.css', 'assets/js/*.js', 'assets/js/**/*.js', 'assets/js/**/**/*.js', 'assets/img/**/*.jpg', 'assets/img/**/*.png'], { base: 'assets' })
    .pipe(gulp.dest('build/assets'))  // copy original assets to build dir
    .pipe(rev())
    .pipe(gulp.dest('build/assets'))  // write rev'd assets to build dir
    .pipe(rev.manifest())
    .pipe(gulp.dest('build/assets')); // write manifest to build dir
});

gulp.task('copy', function () {
  gulp.src('index.html')
    .pipe(gulp.dest('build'));
  gulp.src('assets/fonts/*.*')
    .pipe(gulp.dest('build/assets/fonts'));
  gulp.src('assets/fonts/revicons/*.*')
    .pipe(gulp.dest('build/assets/fonts/revicons'));
});

gulp.task('clean', [], function() {
  return gulp.src("build/*", { read: false }).pipe(clean());
});

gulp.task('watch', function () {
  livereload.listen(35729, function(err) {
    if(err) return console.log(err);
  })
  gulp.watch(['index.html', 'assets/css/*.css','assets/css/**/*.css', 'assets/js/*.js', 'assets/js/**/*.js', 'assets/js/**/**/*.js', 'assets/img/**/*.jpg', 'assets/img/**/*.png'], [], function (e) {
    livereload.changed(e.path, 35729)
  });
});

gulp.task('connect', function() {
  connect.server({
    host: '0.0.0.0',
    root: 'build',
    port: 8000,
    livereload: true
  });
});

gulp.task('default', function() {
  runSequence(
    'dist',
    ['connect', 'watch']
  );
});

gulp.task('dist', ['clean'], function () {
  gulp.start('build');
  gulp.start('copy');
});

Answer 1

您可能需要檢查您的主機是否有任何進程在端口 - 35729 上運行。您可以終止該進程並嘗試重新運行此應用程序。 查找並殺死進程

或者

您可以在代碼中嘗試使用不同於 35729 的端口號。

希望這會有所幫助。