Почему при сборке вылезает ошибка «Did you forget to signal async completion»?

Question

[Влад]

Решил переписать сборку с Gulp 3 на Gulp 4.

Конце пишу:

...
function build () {
    return gulp.series(clean_build, 
        gulp.parallel(
            image_build, 
            fonts_build, 
            js_build, 
            css_build, 
            php_build, 
            html_build));
}
// define tasks
exports.html_build = html_build;
exports.php_build = php_build;
exports.css_build = css_build;
exports.js_build = js_build;
exports.fonts_build = fonts_build;
exports.image_build = image_build;
exports.build = build;

Запускаю:
gulp build

Получаю ошибку:

[21:01:51] The following tasks did not complete: build
[21:01:51] Did you forget to signal async completion?

Добавлял к функциям префикс async, всё равно выдаёт такую ошибку.
Когда использую старый синтаксис с gulp.task, то всё работает.
В чём тут секрет?

Answer 1

[Руслан Лопатин]

exports.build = build();

Comments

[Влад]

Сорри, поздно было, я имел в виду немного другое.
Почему если просто запускать функцию, то работает, а если вложить в сериас, то нет.
Ведь в доке написано, что series() и parallel() могут быть вложены сами в себя или друг в друга на любую глубину.
Но когда прописываешь вот так:
exports.build = gulp.series(build);
или даже оставляешь в функции только gulp.parallel,
ТО возникает эта ошибка.

[Влад]

Хорошо,
Почему этот таск запускается так:

// html build
function html_build () {
    return gulp.src(path.src.html) // get all html files
        .pipe(plumber()) // gulp plugins bug tracking
        .pipe(rigger()) // templates import
        .pipe(gulp.dest(path.build.html)) // deploy html
        .pipe(browserSync.reload({ stream: true })); // browser-sync reload
}

exports.html_build = html_build;

???

А уже вот этот таск только путём явного указания запуска функции:

function build () {
    return gulp.series(
        clean_build, 
        gulp.parallel(
            html_build, 
            js_build, 
            css_build, 
            php_build, 
            fonts_build, 
            image_build
        )
    );
}

exports.build = build();

Да в дефолтном таске всё равно нужно указывать явно:

// default task
exports.default = gulp.series(
    build(),
    gulp.parallel(webserver, watch)
);

Хочу разобраться почему так?

[Руслан Лопатин]

Подозреваю, что ошибка где-то в другом задании. Просто иногда "везёт", и это задание завершается вовремя.

Посмотрите сюда, например: https://github.com/gulpjs/gulp/issues/2316

Возможно, где-то в заданиях есть что-то подобное.

Ну или попробуйте отключать задания по одному - выясните, в каком ошибка.

[Влад]

Руслан Лопатин, Руслан Лопатин, нифига, при любом раскладе, если явно не запустить таск build , то имеем:

[15:09:09] The following tasks did not complete: build
[15:09:09] Did you forget to signal async completion?

Любой таск оставь в функции build, будет такая ошибка. Хоть помечай через async все функции как асинхронные - те же яйца, только в профиль.

[Андрей Галкин]

gulp 3 считал что если функция не объявлена асинхронной то она синхронная (уж извините за капитанство) и фактом ее завершения является возврат из функции либо ее завершение.

gulp 4 более строгий (в нем запрещены синхронные функции) и в нем необходимо явно обозначить завершение таска который точно должен быть асинхронным и никак иначе.
Согласно документации у тебя есть 6 вариантов.

1. вернуть pipe (Stream)
2. вернуть Promise
3. вернуть EventEmitter (const { EventEmitter } = require('events');) после чего вызвать в асинхронной функции у эмиттера событие 'finish'
4. вернуть RxJS Observable
5. вернуть вызов дочернего процесса (const { exec } = require('child_process');)

для синхронных функций, дополнительно есть:
6. вызвать колбек передаваемый первым аргументом в функцию (function (cb) { ... ; cb(); })

проблема в том что ты запускаешь синхронную функцию которые теперь запрещены. если выполнение закончилось соответственно тебе говорят «Did you forget to signal async completion»?

function build () {
    return gulp.series(
        clean_build, 
        gulp.parallel(
            html_build, 
            js_build, 
            css_build, 
            php_build, 
            fonts_build, 
            image_build
        )
    );
}

exports.build = build();

это равносильно

exports.build = gulp.series(
        clean_build, 
        gulp.parallel(
            html_build, 
            js_build, 
            css_build, 
            php_build, 
            fonts_build, 
            image_build
        )
    );;

Что допустимо, а что будет экспортированно в билд если вызвать без скобочек? правильно, "синхронная" функция build.

[Руслан Лопатин]

Всё проще, на самом деле.

Вот реализация parallel: https://github.com/gulpjs/bach/blob/master/lib/par...
Вот реализация series: https://github.com/gulpjs/bach/blob/master/lib/ser...

Из них видно, что функции эти реализованы через callback, и не возвращают ничего. То есть return из функции build бесполезен.

Попробуйте реализовать build таким образом:

function build (done) {
    gulp.series(
        clean_build, 
        gulp.parallel(
            html_build, 
            js_build, 
            css_build, 
            php_build, 
            fonts_build, 
            image_build
        )
    )(done);
}

[Влад]

Андрей Галкин, Спасибо за разъяснение. Действительно сериас и параллел просто ничего не возвращают. Мне понравился вариант с промисом, хотя и у Руслана тоже вариант гуд :)

[Влад]

Время появилось, снова разбираюсь. Тут вот какое дело.
Засунув в функцию промис, я просто избавился от ошибки. Её больше нет, но функция абсолютно ничего не делает. Во как ))

function build () {
    return Promise.resolve(
        gulp.series(
            clean_build, 
            gulp.parallel(
                html_build, 
                js_build, 
                css_build, 
                php_build, 
                fonts_build, 
                image_build
            )
        )
    );
}

exports.build = build;

[Руслан Лопатин]

Непонятно, на что вы надеялись. series возвращает функцию. Так что этот код равносилен просто Promise.resolve(function() {...}). Причём функция, передаваемая в Promise, даже не вызывается.

Если уж так хочется "обещаний", то вот:

function build () {
    return new Promise(
        (resolve, reject) => gulp.series(
            clean_build, 
            gulp.parallel(
                html_build, 
                js_build, 
                css_build, 
                php_build, 
                fonts_build, 
                image_build
            )
        )(error => error === undefined ? resolve() : reject(error))
    );
}

exports.build = build;

Или то же самое через promisify:

const { promisify } = require('util');

function build () {
    return promisify(
        gulp.series(
            clean_build, 
            gulp.parallel(
                html_build, 
                js_build, 
                css_build, 
                php_build, 
                fonts_build, 
                image_build
            )
        )
    )();
}

exports.build = build;

[Руслан Лопатин]

Поправлюсь (эдак я и сам начну понимать, что пишу :) ).

Всё-таки вызов gulp.series() возвращает функцию. Но Gulp, как и написал Андрей Галкин, не обещает, что такая функция, будучи возвращена из задания, будет вызвана. Даже если завернуть её в Promise. Так что вызывать её надо явно.

[Влад]

Андрей Галкин, если в gulp 4 запрещены синхронные функции, то в чём тогда разница между series и parallel? Извините за тупость, я из бэка, если что )

[Андрей Галкин]

Влад, по дословному переводу серийные и параллельные выполнения. series добивается синхронности тем что ожидает пока не будет выполнена предыдущая функция (async completion) но сами функции которые он выполняет асинхронные. parallel запускает несколько функций одновременно и ждет ожидания всех. если перевести на "бек php" в первом случае заблокирована сессия и пользователь ждет (фаст пример очень долгий запрос в phpmyadmin) во втором сессии нет и он запускает воркеры fpm сколько хочет одновременно по разным ссылкам(контроллерам) и ждет пока все запросы отработают. Просто все это происходит в рамках одного процесса (созданием контекста выполнения и переключения между ними в моменты когда все равно делать нечего - ожидание I/O диск сеть и т.п.).

[Андрей Галкин]

Попробуйте так

function build (done) {
    gulp.series(
        clean_build, 
        gulp.parallel(
            html_build, 
            js_build, 
            css_build, 
            php_build, 
            fonts_build, 
            image_build
        ),
       done
    )();
}

и если что то промис возвращается вот так:

async function() {
   return await gulp.series(
            clean_build, 
            gulp.parallel(
                html_build, 
                js_build, 
                css_build, 
                php_build, 
                fonts_build, 
                image_build
            )
        )
}

Код для размышлений)

async function x() {
    // вернуть await надо
   	return await async function() {
   		return 'hi';
   }
}

console.log(x);
console.log(x()); //<-- Promise

x().then(async (cb) => {
 console.log(cb);
 console.log(cb());
 console.log(await cb());
});

Answer 2

[Влад]

Забыл добавить.

Если прописать запуск всех задач вот так:

exports.build = gulp.series(
    clean_build, 
    gulp.parallel(image_build, fonts_build, js_build, css_build, php_build, html_build)
);

то всё работает. А если засунуть это в функцию, то нет. Почему?