Returning a stream but still getting error "Did you forget async completion?" Gulp 4

Question

I am building a website on gulp, this code snippet basically contains 3 tasks browser-sync jekyll-build stylus, browser-sync task depends upon jekyll-build.

browser-sync works fine but the stylus function in which I am returning a stream is giving a error which is not expected.

Below is my code snippet. I am returning a stream here which is one of the solutions mentioned in the doc Async Completion but still I get the error.

var gulp        = require('gulp'),
    plumber     = require('gulp-plumber'),
    browserSync = require('browser-sync'),
    stylus      = require('gulp-stylus'),
    uglify      = require('gulp-uglify'),
    concat      = require('gulp-concat'),
    jeet        = require('jeet'),
    rupture     = require('rupture'),
    koutoSwiss  = require('kouto-swiss'),
    prefixer    = require('autoprefixer-stylus'),
    imagemin    = require('gulp-imagemin'),
    cp          = require('child_process');

var messages = {
    jekyllBuild: '<span style="color: grey">Running:</span> $ jekyll build'
};

var jekyllCommand = (/^win/.test(process.platform)) ? 'jekyll.bat' : 'jekyll';

/**
 * Build the Jekyll Site
 */
gulp.task('jekyll-build', function (done) {
    browserSync.notify(messages.jekyllBuild);
    return cp.spawn(jekyllCommand, ['build'], {stdio: 'inherit'})
        .on('close', done);
});


/**
 * Wait for jekyll-build, then launch the Server
 */
gulp.task('browser-sync', gulp.series('jekyll-build'), function() {
    browserSync({
        server: {
            baseDir: '_site'
        }
    });
    done();
});

/**
 * Stylus task
 */
gulp.task('stylus', function() {
    return gulp.src('src/styl/main.styl').pipe(plumber())
        .pipe(
            stylus({
            use: [koutoSwiss(), prefixer(), jeet(), rupture()],
            compress: true,
            })
        )
        .pipe(gulp.dest('_site/assets/css/'))
        .pipe(gulp.dest('assets/css'))
        .pipe(browserSync.stream());
});

ERROR SHOWN BELOW

[23:28:52] Using gulpfile ~/berserker1.github.io/gulpfile.js
[23:28:52] Starting 'default'...
[23:28:52] Starting 'browser-sync'...
[23:28:52] Starting 'jekyll-build'...
Configuration file: /home/aaryan/berserker1.github.io/_config.yml
            Source: /home/aaryan/berserker1.github.io
       Destination: /home/aaryan/berserker1.github.io/_site
 Incremental build: disabled. Enable with --incremental
      Generating... 
                    done in 0.234 seconds.
 Auto-regeneration: disabled. Use --watch to enable.
[23:28:52] Finished 'jekyll-build' after 818 ms
[23:28:52] Finished 'browser-sync' after 819 ms
[23:28:52] Starting 'stylus'...
[23:28:53] The following tasks did not complete: default, stylus
[23:28:53] Did you forget to signal async completion?

Answer 1

There is an issue here (whether it is the same as the one in your question we'll see if it helps):

gulp.task('browser-sync', gulp.series('jekyll-build'), function() {
    browserSync({
        server: {
            baseDir: '_site'
        }
    });
    done();
});

I gulp v4 task takes only two arguments - the code above has three. This should be correct:

gulp.task('browser-sync', gulp.series('jekyll-build', function(done) {
    browserSync({
        server: {
            baseDir: '_site'
        }
    });
    done();
}));

Plus, I added the done parameter in the first line. See if this helps.