Gulp 4: Functions that return gulp.series or gulp.parallel do not allow tasks to complete

What were you expecting to happen?

I wrote up this gulp 4 code:

//reloads the browser
function reload(done){
  browserSync.reload();
  done();
}

//If running in PHP mode, convert the html files to php files before reloading
gulp.task('pug:reload', (done)=>{
  if (config.serve === 'php'){
    return gulp.series('convert-HTML', reload);
  } else {
    return gulp.series(reload);
  }
});

//The main pug task
gulp.task('pug', gulp.series(
  'pug:compile',
  'pug:reload',//the one causing the issue
));

When running in PHP mode, I expected that the main pug task would essentially equate to this:

gulp.task('pug', gulp.series(
  'pug:compile',
  gulp.series('convert-HTML', reload),
));

When running in HTML mode, I expected that the main pug task would essentially equate to this:

gulp.task('pug', gulp.series(
  'pug:compile',
  gulp.series(reload),
));

I tested putting the code inline like that just to make sure that the tasks weren’t broken. It did indeed work as expected.

What actually happened?

When I tried to run the ‘pug:reload’ task, it came up with this error:

[00:45:34] The following tasks did not complete: pug:reload
[00:45:34] Did you forget to signal async completion?

The only way I could get around this was to do this with my code:

var pugReload = gulp.series(reload);
if (config.serve === 'php') pugReload = gulp.series('convert-HTML', reload);

gulp.task('pug', gulp.series(
  'pug:compile',
  pugReload,
));

It was then able to compile successfully.

What version of gulp are you using?

[01:10:37] CLI version 1.2.2
[01:10:37] Local version 4.0.0-alpha.2

What versions of npm and node are you using?

npm: 3.10.6 node: 4.4.7

[selrond]

This should really be explained better in the docs, I’ve just spent a couple of hours trying to figure out how to run a basic gulp setup…

import gulp from 'gulp'
import sass from 'gulp-sass'
import pug from 'gulp-pug'

gulp.task('styles', () => {
	return gulp.src('src/sass/**/*.scss')
		.pipe(sass())
		.pipe(
			gulp.dest('./dist')
		)
})

gulp.task('markup', () => {
	return gulp.src('src/pug/**/*.pug')
		.pipe(pug())
		.pipe(
			gulp.dest('./dist')
		)
})

gulp.task('build', (done) => (
	gulp.series('styles', 'markup')(done)
))

Had I not found this issue, I’d pull all of my hair out

[Dan503]

Ahh ok, I get it now. Thanks for the help 😃

I had a thought though. Since the main reason that the task fails is because the return function isn’t being called, I thought I would try calling it from the return statement.

Using this syntax works 😃

gulp.task('pug:reload', (done)=>{
  if (config.serve === 'php'){
    return gulp.series('convert-HTML', reload)(done);
  } else {
    return gulp.series(reload)(done);
  }
});