CSS Blog For Everyone

Quick fix for Gulp error: “The following tasks did not complete… Did you forget to signal async completion?”

When working in Gulp, you may come across this error:

The following tasks did not complete... Did you forget to signal async completion?

It is caused because in Gulp 4 all tasks are automatically asynchronous.

Synchronous functions execute one after the other, and each function must wait until the previous one is completed before themselves running. Asynchronous functions, on the other hand, can start running while still waiting for the result of previous functions.

This makes processes more efficient since they aren’t blocked. But in order to know when a function has completed, we need them to return explicit signifiers that they are done. Most Gulp tasks like src() or dest() will return a Node stream, so you won’t have to worry about it.

However, if you have a custom function that isn’t returning a stream, you need to add a callback function at the end of it. Otherwise you will get that error message.

To fix the error, you will need to add a callback function like in this example:

function helloWorld(cb){
    console.log('Hellooooo world!');
    cb();
}

In this helloWorld function, we’ve added the cb() callback function that we set as a parameter, and then invoke at the end of the function. Adding this will signal async completion, and should fix that error happening.

If you’d like even more in-depth information on how to set up Gulp, check out my course, Gulp 4 for Beginners!

Enjoyed this post?

Tweet me about it! 😀

Want to learn how to build a website?

I’m making a course that will teach you how to build a real-world responsive website from scratch!

Learn more

Leave a comment