Gulp 吞咽：在不引起无限循环的情况下就地修改监视的文件

我试图使用gulp和JSC来防止代码气味。我还想使用手表，以便在进行任何更改时发生这种情况。我遇到的问题是jscs修改正在监视的源文件。这会导致gulp进入一个JSC修改文件的无限循环，然后看到更改并一次又一次地启动JSC

const gulp = require('gulp');

gulp.task('lint', function() {
    return gulp.src('/src/**/*.js')
        .pipe(jscs({
            fix: true
        }))
        .pipe(jscs.reporter())
        .pipe(gulp.dest('/src'));
});

gulp.task('watch', function() {
    gulp.watch('/src/**/*.js', ['lint']);
});

---

通常，从一个“吞咽”任务中重写源文件是个坏主意。打开这些文件的任何编辑器/IDE可能会也可能不会优雅地处理这些文件。通常最好将文件写入单独的

dist

文件夹

也就是说，这里有两种可能的解决方案：

解决方案1

您需要停止

gulpjscs

插件第二次运行并再次写入文件，从而防止运行无限循环。要实现这一点，您只需将以下内容添加到

lint

任务中：

var cache = require('gulp-cached');

gulp.task('lint', function() {
  return gulp.src('/src/**/*.js')
    .pipe(cache('lint'))
    .pipe(jscs({
        fix: true
    }))
    .pipe(cache('lint'))
    .pipe(jscs.reporter())
    .pipe(gulp.dest('/src'));
});

var watch = require('gulp-watch');

function pausableWatch(watchedFiles, tasks) {
  var watcher = watch(watchedFiles, function() {
    watcher.close();
    gulp.start(tasks, function() {
      pausableWatch(watchedFiles, tasks);
    });
  });
}

gulp.task('watch', function() {
  pausableWatch('/src/**/*.js', ['lint']);
});

第一个

cache（）。第二个
cache（）

此解决方案的缺点是
lint
任务仍在执行两次。这不是什么大问题，因为在第二次运行期间，文件实际上没有被删除<代码>吞咽缓存
防止这种情况发生。但如果您确实想确保只有在有其他方法时才运行
lint

解决方案2

首先，您应该使用而不是内置库（这是因为它使用高级库而不是内置库）

然后，您可以编写一个简单的
pausableWatch（）
函数，并在
watch
任务中使用该函数：

var cache = require('gulp-cached');

gulp.task('lint', function() {
  return gulp.src('/src/**/*.js')
    .pipe(cache('lint'))
    .pipe(jscs({
        fix: true
    }))
    .pipe(cache('lint'))
    .pipe(jscs.reporter())
    .pipe(gulp.dest('/src'));
});

var watch = require('gulp-watch');

function pausableWatch(watchedFiles, tasks) {
  var watcher = watch(watchedFiles, function() {
    watcher.close();
    gulp.start(tasks, function() {
      pausableWatch(watchedFiles, tasks);
    });
  });
}

gulp.task('watch', function() {
  pausableWatch('/src/**/*.js', ['lint']);
});

在上面的示例中，在
lint
任务开始之前，停止
观察者。因此，在
lint
任务期间写入的任何
.js
文件都不会触发
监视程序。
lint
任务完成后，
watcher
再次启动

此解决方案的缺点是，如果在执行
lint
任务时保存
.js
文件，则
观察者将不会拾取更改（因为它已停止）。您必须在
lint
任务完成后（当
观察者重新启动时）保存
.js
文件。
感谢您的关注！这修正了无限循环。我还想弄清楚如何使它只运行一次任务。@JaredChristensen，因为有人问我，我又看了一遍，并想出了另一个解决方案。