具有自动更新/自动生成文件的无限监视循环

Question

我正在尝试使用一些gulp ( jscs，csscomb )在开发时动态地对我的代码进行样式化。

对于使用格式任务运行无限循环的gulp进程，我遇到了问题。

我相信会发生什么：

• 启动某种类型的serve任务
• 对所有任务执行初始运行，以便为暂存服务器准备文件。
• 本地暂存服务器与监视任务并行启动。
• myfile.scss由开发人员更新。
• 守望者开始执行csscomb任务。
• 修改文件并替换它。
• 观察者任务会看到文件替换中的更改&再次启动格式化任务.
• csscomb插件再次运行等等..。

下面是导致这个循环的一个片段。(注:这使用v4的gulp)

'use strict'

import { task, parallel, series, src, dest, watch, plugins } from './gulp';

import { startStagingServer } from './servers';

import { solution } from './solution.map';

const path = require('path');

task('serve', parallel(startStagingServer, watchStyles);

function watchStyles() {
  watch([ solution.src.styles ], series(formatStyles, compileStyles))
}

function formatStyles(done) {
  return src([ solution.src.styles ])
    .pipe(plugins.csscomb())
    .pipe(dest(solution.src.mount)) // the root of the solution
}

function compileStyles() {
  return src([ solution.src.styles ])
    .pipe(plugins.sass().on('error', plug.sass.logError))
    .pipe(dest(path.join(solution.dest.stage, 'serve')));
}

有谁知道避免这种情况的方法吗？

Answer 1

避免这种情况的方法是不要把补丁放在观察者身上。使用两个单独的函数:一个修复函数，另一个没有。只注意不修复的函数。例如：

function taskJscsFix() {
    return gulp.src(path.JS)
        .pipe(jscs({
            configPath: './gulp/.jscsrc',
            fix: true
        }))
        .pipe(gulp.dest(path.SRC.JS));
}

function taskScripts() {
    return gulp.src(path.JS)
        .pipe(jscs({
            configPath: './gulp/.jscsrc'
        }))
        .pipe(jscs.reporter())
        .pipe(gulp.dest(path.DEST.JS));
}