Error: Gulp is using ts-node and returning 'void' instead of 'Task', but it cannot find the type 'Task'

Question

Error: Gulp is using ts-node and returning 'void' instead of 'Task', but it cannot find the type 'Task'

Seeking assistance from experienced individuals in the realm of gulp.js and typescript - could someone provide guidance for a struggling newcomer?

I am currently utilizing the most recent versions of all relevant tools (node, ts-node, gulp, ts, @types/gulp, etc). Gulp is being executed through ts-node, using a gulpfile.ts instead of gulpfile.js, but I am encountering the following error:

error TS2345: Argument of type 'Promise<void>' is not assignable to parameter of type 'Task'.
Type 'Promise<void>' does not match the signature expected by 'TaskFunction'.
The return type ''Promise<void>'' is incompatible with '(done: TaskCallback): void | EventEmitter | ChildProcess | Stream | Observable<any> | PromiseLike<any>'.

The key portions of my code are as follows:

gulp.parallel(
    subTask("directory_1"),
    subTask("directory_2")
);

async function subTask(sDirectory:string){
    await gulp.src("src/"+sDirectory+"/*.*")
        // Perform tasks such as linting, transpiling, uglifying, etc.
        .pipe(gulp.dest("dest/"+sDirectory+"/"));
    return;
}

The code functions correctly when the directory strings are hardcoded within subTask (creating separate copies for each directory), however it fails when attempting to pass the directories as parameters.

It appears that the issue lies in returning a void promise from subTask whereas gulp expects a type of Task (a subtype of

TaskFunction</code). Trouble arises when trying to assign a type to <code>subTask

(assigning either Task or TaskFunction results in "Cannot find name 'Task'").

What mistake am I making here? And more importantly, how can I resolve it? Can anyone provide example code to rectify this issue?

Your assistance and guidance would be immensely appreciated. Thank you.

Best regards,

Dulux-Oz

typescript types gulp

Answer 1

Answer №1

Your function has two main issues: firstly, it doesn't return anything; and secondly, it is marked as async. While gulp streams operate in an asynchronous manner, they are not promises, so there is no need to await them. Therefore, the async declaration is unnecessary.

To address this, I recommend updating your function as follows:

function subTask(sDirectory:string) {
    return function() {
        return gulp.src("src/"+sDirectory+"/*.*")
        // Perform linting, transpiling, uglifying, etc
        .pipe(gulp.dest("dest/"+sDirectory+"/"));
    };
}

The remaining portion of your code appears to be correct.

Answer 2

Your function has two main issues: firstly, it doesn't return anything; and secondly, it is marked as async. While gulp streams operate in an asynchronous manner, they are not promises, so there is no need to await them. Therefore, the async declaration is unnecessary.

To address this, I recommend updating your function as follows:

function subTask(sDirectory:string) {
    return function() {
        return gulp.src("src/"+sDirectory+"/*.*")
        // Perform linting, transpiling, uglifying, etc
        .pipe(gulp.dest("dest/"+sDirectory+"/"));
    };
}

The remaining portion of your code appears to be correct.

Answer 3

Answer №2

After receiving advice from @goto-0, I found that their answer was 99% accurate (big thanks to @goto-0). However, following the suggested refactor, I encountered an error stating

Did you forget to signal async completion?

.

The complete solution required making the sub-function inside subTask an asynchronous function:

function subTask(sDirectory:string) {
    return async function() {
        return gulp.src("src/"+sDirectory+"/*.*")
        // Further processing like linting, transpiling, uglifying, etc
        .pipe(gulp.dest("dest/"+sDirectory+"/"));
    };
}

All is well now :-)

Answer 4

After receiving advice from @goto-0, I found that their answer was 99% accurate (big thanks to @goto-0). However, following the suggested refactor, I encountered an error stating

Did you forget to signal async completion?

.

The complete solution required making the sub-function inside subTask an asynchronous function:

function subTask(sDirectory:string) {
    return async function() {
        return gulp.src("src/"+sDirectory+"/*.*")
        // Further processing like linting, transpiling, uglifying, etc
        .pipe(gulp.dest("dest/"+sDirectory+"/"));
    };
}

All is well now :-)

Error: Gulp is using ts-node and returning 'void' instead of 'Task', but it cannot find the type 'Task'

Answer №1

Answer №2

Similar questions

When incorporating a second overload as an object, it is generating a pair of errors

The operation failed with a TypeError because the object does not allow the addition of the newField property

What is the best way to transfer user data from the backend to the frontend?

Setting up Firebase App Check in an Angular projectWould you like to know

Assign a property to an array of objects depending on the presence of a value in a separate array

Creating a personal TypeScript language service extension in Visual Studio Code

The act of exporting an enum from a user-defined TypeScript path leads to the error message "Module not

efficiently managing errors in a Nest Jest microservice with RabbitMQ

Having an issue with forkJoin where the code seems to get stuck and does not continue execution after

Nuxt 3 turns a blind eye to TypeScript errors upon code saving

After successfully building with Vite, an error occurs stating "TypeError: can't convert undefined to object." However, during development with Vite, everything functions flawlessly

What is the recommended way to use the async pipe to consume a single Observable property in a view from an Angular2

Tips on inferring a distinct generic type for every element within an array of objects

What is the correct way to declare a variable with a generic type parameter?

Create a system for detecting changes in simple input elements and triggering a function to update the final result

When utilizing the useRef hook in Material-UI, an error may arise stating: "The property 'value' is not found on the type 'never'."

Guide on transforming a JSON string into an array of custom objects using the json2typescript NPM module within a TypeScript environment

How can one determine the logical data type within a cell array of strings in Matlab?

Arranging React Grid Items with Stylish Overlapping Layout

What is the syntax for defining parameters in an overloaded arrow function in TypeScript?