Using Gulp watch, Axios and Browsersync to do an HTTP get before reloading browser on file change - gulp

Question

I'm trying to watch 2 sets of folders. One set just requires a browser reload on change. The second requires "reinitializing the framework", via a separate, background http get before doing the reload.
My current attempt handles this properly once, but only once. Can you tell me both why and how to fix it? The troublesome portion is in the second watch task.
const gulp = require('gulp');
const axios = require("axios");
const bs = require('browser-sync').create();
const { reload } = bs;
const url = "http://127.0.0.1:80/healthcheck?fwreinit=1";
var paths = {
refresh: [
"./layouts/**/*.*",
"./views/**/*.*",
"./includes/**/*.js",
"./includes/**/*.css"
],
reinit: [
"./handlers/**/*.*",
"./models/**/*.*",
"./interceptors/**/*.*",
"./config/**/*.*"
]
}
gulp.task('watch', () => {
gulp.watch(paths.refresh, (done) => {
reload();
done();
});
gulp.watch(paths.reinit, () => {
console.log("Reinitializing framework");
axios.get(url)
.then(response => {
console.log(response.data.trim());
reload();
})
.catch(error => {
console.log("Error: Please ensure you have a /healthcheck route set up in /config/router.cfc!");
console.log("Error: Once you've done that, please shut down commandbox then try browsersync again.");
});
});
});
gulp.task('proxy', () => {
bs.init({
proxy: "localhost:80",
port: 81,
open: true,
notify: false
});
});
gulp.task('default', gulp.parallel('watch', 'proxy'));

Answer 1

Gulp watch passes a "done" callback that must be called in order to proceed. Changing the code to the following solved the problem.
const gulp = require('gulp');
const axios = require("axios");
const bs = require('browser-sync').create();
const { reload } = bs;
const url = "http://127.0.0.1:80/healthcheck?fwreinit=1";
var paths = {
refresh: [
"./layouts/**/*.*",
"./views/**/*.*",
"./includes/**/*.js",
"./includes/**/*.css"
],
reinit: [
"./handlers/**/*.*",
"./models/**/*.*",
"./interceptors/**/*.*",
"./config/**/*.*"
]
}
gulp.task('watch', () => {
gulp.watch(paths.refresh, (done) => {
reload();
done();
});
gulp.watch(paths.reinit, (done) => {
console.log("Reinitializing framework");
axios.get(url)
.then(response => {
console.log(response.data.trim());
reload();
done();
})
.catch(error => {
console.log("Error: Please ensure you have a /healthcheck route set up in /config/router.cfc!");
console.log("Error: Once you've done that, please shut down commandbox then try browsersync again.");
});
});
});
gulp.task('proxy', () => {
bs.init({
proxy: "localhost:80",
port: 81,
open: true,
notify: false
});
});
gulp.task('default', gulp.parallel('watch', 'proxy'));