Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problems with gulp 4 watch #175

Open
iby opened this issue Dec 19, 2019 · 2 comments
Open

Problems with gulp 4 watch #175

iby opened this issue Dec 19, 2019 · 2 comments

Comments

@iby
Copy link

iby commented Dec 19, 2019

I found quite a few watch-related issues, unfortunately none helped me with my case. I noticed two problems:

  1. When stopping the task with Control+C the script fails with the following error. If I remove watchFiles or startNodemon/BrowserSync tasks, everything works fine.

    [14:09:04] The following tasks did not complete: serve, <parallel>, watchFiles
    [14:09:04] Did you forget to signal async completion?
    npm ERR! code ELIFECYCLE
    npm ERR! errno 1
    npm ERR! @ serve: `gulp serve`
    npm ERR! Exit status 1
  2. After trial and error I figured that if a callback gets passed/invoked in watch files task it would prevent the termination failure, however in approx. ⅓ launches the file watching wouldn't work. Literally. Upon one launch it behaves as expected when changing a file. Upon next launch it wouldn't see changes at all and won't run.

Here's the gulp file:

import BrowserSync from "browser-sync";
import del from "del";
import gulp from "gulp";

import changed from "gulp-changed";
import nodemon from "gulp-nodemon";
import ts from "gulp-typescript";

const browserSync = BrowserSync.create();
const tsProject = ts.createProject("./tsconfig.json");

function cleanProduct() {
    return del(["./product/js", "./product/css", "./entrypoint"]);
}

function buildJS() {
    return gulp
        .src(["./source/ts/**/*.ts", "./source/d.ts/**/*.ts"])
        .pipe(changed("./product/js", {extension: ".js"}))
        .pipe(tsProject())
        .pipe(gulp.dest("./product/js"))
        .pipe(browserSync.stream());
}

function watchFiles() {
    gulp.watch("./source/ts/**/*.ts", gulp.series(buildJS));
}

// This callback setup is needed for correct BrowserSync initialization in case you wonder…
function startNodemon(cb) {
    let isStarting = false;

    let server = nodemon({
        script: "./product/js/index.js",
        ignore: "./product/js/**/*Test.js",
        watch: "./product/js/**/*.js",
        stdout: false,
        ext: ""
    });

    const finalize = () => {
        if (!isStarting) { return; }
        isStarting = false;
        cb();
    };

    server.on("start", () => {
        isStarting = true;
        setTimeout(finalize, 5000);
    });

    server.on("stdout", (stdout) => {
        process.stdout.write(stdout); // pass the stdout through
        if (isStarting) { finalize(); }
    });
}

function startBrowserSync(cb) {
    browserSync.init({
        proxy: "http://localhost:8080",
        port: 8081,
        ui: false
    }, cb);
}

const build = gulp.series(cleanProduct, gulp.parallel(buildJS));
const serve = gulp.series(build, gulp.parallel(gulp.series(startNodemon, startBrowserSync), watchFiles));

exports.default = build;
exports.build = build;
exports.serve = serve;

I tried removing BrowserSync out of the equation, but it doesn't seem to be making any difference. Is there any special treatment for the module or other workaround to make it work without throwing errors on exit and not using a callback with file watch task?

@ksr583
Copy link

ksr583 commented Jan 29, 2020

I'm seeing the same issues

@Extarys
Copy link

Extarys commented Mar 31, 2020

Same issue, I included the versions I use. Sad, it's a pain to start node after every changes 😢

[22:59:41] [nodemon] starting `node ./build/server.js`
{"level":30,"time":1585623581312,"pid":25258,"hostname":"","msg":"Server listening at http://127.0.0.1:3000","v":1}
{"level":30,"time":1585623581313,"pid":25258,"hostname":"","msg":"server listening on 3000","v":1}
[22:59:41] The following tasks did not complete: default, serve
[22:59:41] Did you forget to signal async completion?

Packages:
"gulp-nodemon": "^2.5.0",
"gulp": "^4.0.2",
Node version: v12.16.1

Task

const serve = function(done) {
    nodemon({
        script: './build/server.js'
      , ext: 'js html'
      , env: { 'NODE_ENV': 'development' }
      , done: done
      })
};

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants