Avoid the task completion callback called too many times?

Question

Given the following gulp tasks I'm able to successfully start the gulp, webpack and nodemon process, but the webpack tasks are open ended, so they will continue to fire the completion handler when their watch / compile cycle is complete.

The server task depends on the client task output, so I need these operations to be synchronous, hence the done

function onBuild(done) {
    return function(err, stats) {
        if(err) {
            gutil.log('Error', err);
            if(done) {
                done();
            }
        } else {
            Object.keys(stats.compilation.assets).forEach(function(key){
                gutil.log('Webpack: output ', gutil.colors.green(key));
            });
            gutil.log('Webpack: ', gutil.colors.blue('finished ', stats.compilation.name));
            if(done) {
                done();
            }
        }
    }
}

//dev watch
gulp.task('webpack-client-watch', function(done) {
    webpack(devConfig[0]).watch(100, function(err, stats) {
        onBuild(done)(err, stats);
    });
});

gulp.task('webpack-server-watch', function(done) {
    webpack(devConfig[1]).watch(100, function(err, stats) {
        onBuild(done)(err, stats);
        nodemon.restart();
    });
});

gulp.task('webpack-watch',function(callback) {
    runSequence(
        'webpack-client-watch',
        'webpack-server-watch',
        callback
    );
});

gulp.task('nodemon', ['webpack-watch'], function() {
    nodemon({
        script: path.join('server/dist/index.js'),
        //ignore everything
        ignore: ['*'],
        watch: ['foo/'],
        ext: 'noop'
    }).on('restart', function() {
        gutil.log(gutil.colors.cyan('Restarted'));
    });
});

When I change a file, the watcher does its thing and gulp complains about the callback being called yet again.

[15:00:25] Error: task completion callback called too many times

I've looked at this, but not sure if its applicable.

Why might I be getting "task completion callback called too many times" in gulp?

Basically, I just want this to work synchronously and continuously without error.

gulp nodemon

Answer 1

This solved it for me: Just don't call the callback parameter in your webpack-watch task. Leave it out completely.
After that, the watcher works fine and fast without complaining.

Answer 2

If public folder exists in your application. Please remove and re-run, after you can see this issue resolved.