时间戳

首页 > 解决方案 > 浏览器同步未在 gulp 中重新加载

javascript - 浏览器同步未在 gulp 中重新加载

问题描述

我在终端中运行 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);
};

标签： javascriptgulpbrowser-sync

解决方案

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

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

更多信息在这里：Gulp“完成”方法有什么作用？

以下是您的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.
};

推荐阅读