浏览器同步未在 gulp 中重新加载答案

【问题标题】：Browser-sync not reloading in gulp浏览器同步未在 gulp 中重新加载
【发布时间】：2020-04-26 19:55:08
【问题描述】：

我在终端中运行 gulp serve ，然后弹出窗口。但是，当我在 .html 中进行更改时，这些更改不会重新加载到页面上。我不知道什么是异步完成，因为这是我第一次收到这个错误。

[BS] Local URL: http://localhost:3000
[BS] External URL: http://10.0.0.58:3000
[BS] Serving files from: temp
[BS] Serving files from: dev
[BS] Serving files from: dev/html
^C[15:49:48] The following tasks did not complete: serve
[15:49:48] Did you forget to signal async completion?

let serve = () => {
    browserSync({
        notify: true,
        reloadDelay: 0, // A delay is sometimes helpful when reloading at the
        server: {       // end of a series of tasks.
            baseDir: [
                `temp`,
                `dev`,
                `dev/html`
            ]
        }
    });
    watch(`dev/html/**/*.html`, series(validateHTML)).on(`change`, reload);
    watch(`dev/js/*.js`, series(lintJS, compressJS)).on(`change`, reload);
    watch (`dev/css/**/*.css`, series(compressCSS)) .on(`change`, reload);
};

【问题讨论】：

标签： javascript gulp browser-sync

【解决方案1】：

Gulp 4 要求每个任务都完成，以便它可以继续以指定的顺序（例如并行或串行）运行其他任务。

您收到该致命错误是因为您的 serve 任务缺少 done 回调，它让 gulp 知道您已准备好开始队列中的下一个任务。

更多信息在这里：What does Gulp "done" method do?

以下是您的 serve 任务的更新版本，它将允许它继续并发运行而不会导致致命错误。

let serve = (done) => { // add done as an argument
    browserSync({
        notify: true,
        reloadDelay: 0, // A delay is sometimes helpful when reloading at the
        server: {       // end of a series of tasks.
            baseDir: [
                'temp',
                'dev',
                'dev/html'
            ]
        }
    });
    watch('dev/html/**/*.html', series(validateHTML)).on('change', reload);
    watch('dev/js/*.js', series(lintJS, compressJS)).on('change', reload);
    watch ('dev/css/**/*.css', series(compressCSS)) .on('change', reload);
    done();  // call the done method when you are ready to move onto the next task.
};

【讨论】：