Infinite looping

[ryanaltvater]

When I make a change to a SCSS file, both "scss" and "css" tasks run and somehow end up in an infinite loop because the "css" task is watching my SCSS files for changes (Option 1). I've tried a few different approaches to try and solve this, but the only thing that seems to work is not having CSScomb run automatically and instead manually. That's not the desire, but it works.

What might I be doing wrong? I realize the "watch" task might be the issue, but I've removed the "scss" task from "watch" and put it directly on the "css" task (Option 2). I've also duplicated the "watch" and split the tasks (Option 3). It makes sense why it's looping. I just can't figure out a way to prevent it.

Option 1:

/* ============================== */
/*  SCSS
/* ============================== */

gulp.task('scss', function() {
    return gulp.src([
        srcSCSS         + '**/*.scss',
        '!' + srcSCSS   + 'bourbon/**/*',
        '!' + srcSCSS   + 'neat/**/*'
    ])
    .pipe(csscomb())
    .pipe(gulp.dest(srcSCSS));
});


/* ============================== */
/*  CSS
/* ============================== */

gulp.task('css', function() {
    return gulp.src([
        srcSCSS         + 'styles.scss'
    ])
    .pipe(plumber({
        errorHandler    : notify.onError('Error: <%= error.message %>')
    }))
    .pipe(sass())
    .pipe(autoprefixer({
        browsers        : ['last 2 versions'],
        cascade         : false
    }))
    .pipe(cmq())
    .pipe(cssmin())
    .pipe(header(banner, {
        package         : package
    }))
    .pipe(gulp.dest(destCSS))
    .pipe(reload({
        stream          : true
    }));
});


/* ============================== */
/*  WATCH
/* ============================== */

gulp.task('watch', function() {
    gulp.watch(srcCSS   + '**/*.scss', ['scss', 'css']);
});

Option 2:

/* ============================== */
/*  SCSS
/* ============================== */

gulp.task('scss', function() {
    return gulp.src([
        srcSCSS         + '**/*.scss',
        '!' + srcSCSS   + 'bourbon/**/*',
        '!' + srcSCSS   + 'neat/**/*'
    ])
    .pipe(csscomb())
    .pipe(gulp.dest(srcSCSS));
});


/* ============================== */
/*  CSS
/* ============================== */

gulp.task('css', ['scss'], function() {
    return gulp.src([
        srcSCSS         + 'styles.scss'
    ])
    .pipe(plumber({
        errorHandler    : notify.onError('Error: <%= error.message %>')
    }))
    .pipe(sass())
    .pipe(autoprefixer({
        browsers        : ['last 2 versions'],
        cascade         : false
    }))
    .pipe(cmq())
    .pipe(cssmin())
    .pipe(header(banner, {
        package         : package
    }))
    .pipe(gulp.dest(destCSS))
    .pipe(reload({
        stream          : true
    }));
});


/* ============================== */
/*  WATCH
/* ============================== */

gulp.task('watch', function() {
    gulp.watch(srcCSS   + '**/*.scss', ['css']);
});

Option 3:

/* ============================== */
/*  SCSS
/* ============================== */

gulp.task('scss', function() {
    return gulp.src([
        srcSCSS         + '**/*.scss',
        '!' + srcSCSS   + 'bourbon/**/*',
        '!' + srcSCSS   + 'neat/**/*'
    ])
    .pipe(csscomb())
    .pipe(gulp.dest(srcSCSS));
});


/* ============================== */
/*  CSS
/* ============================== */

gulp.task('css', function() {
    return gulp.src([
        srcSCSS         + 'styles.scss'
    ])
    .pipe(plumber({
        errorHandler    : notify.onError('Error: <%= error.message %>')
    }))
    .pipe(sass())
    .pipe(autoprefixer({
        browsers        : ['last 2 versions'],
        cascade         : false
    }))
    .pipe(cmq())
    .pipe(cssmin())
    .pipe(header(banner, {
        package         : package
    }))
    .pipe(gulp.dest(destCSS))
    .pipe(reload({
        stream          : true
    }));
});


/* ============================== */
/*  WATCH
/* ============================== */

gulp.task('watch', function() {
    gulp.watch(srcCSS   + '**/*.scss', ['scss']);
    gulp.watch(srcCSS   + '**/*.scss', ['css']);

// or

    gulp.watch(srcCSS   + '**/*.scss', ['css']);
    gulp.watch(srcCSS   + '**/*.scss', ['scss']);
});

[tonyganch]

Duplicate of koistya/gulp-csscomb#20
Until everyone is certain the issue is with csscomb itself and not gulp task, I'm closing the issue.