javascript - 在服务器进程完成重新启动之前重新加载 gulp-livereload

Question

我正在配置我的gulp.js gulpfile 以监视我的目录中的文件更改，并且 1）重新加载我的快速服务器和 2）发出 livereload“更改”事件，以便我的浏览器（带有 LiveReload chrome 扩展名）将重新加载页面我正在开发。

这是我的 gulpfile：

var gulp = require('gulp')
  , nodemon = require('gulp-nodemon')
  , livereload = require('gulp-livereload');

gulp.task('startReloadServer', function() {
  livereload.listen();
});

gulp.task('demon', function () {
  nodemon({
    script: 'server.js',
    ext: 'js html',
    env: {
      'NODE_ENV': 'development'
    }
  })
    .on('start', ['startReloadServer'])
    .on('restart', function () {
      console.log('restarted!');
      livereload.changed();
    });
});

gulp.task('default', ['demon']);

然而，当我对其中一个视图 (.html) 文件进行更改时，我的浏览器会在节点服务器进程有机会重新联机之前重新加载页面：

如何更改我的 gulpfile 以在nodemon 准备好接收请求后发出 livereload.changed() 事件？

Answer 1

我发现了类似的问题，然后我写了我的解决方案。
当节点 app.listen() 被调用或移植时 Gulp 观察（livereload、nodejs 和 gulp）

nodemon({script: 'app.js',
         nodeArgs: ['--harmony'],
         stdout: false})
    .on('readable', function(data) {
        this.stdout.on('data', function(chunk) {
            if (/koa server listening/.test(chunk)) {
                console.log('livereload');
                livereload.reload();
            }
            process.stdout.write(chunk);
        });
        this.stderr.pipe(process.stderr);
    });

Answer 2

我也遇到了这个问题。我能想到的最好办法就是将呼叫延迟livereload.changed()一秒钟。

nodemon.on('restart', function() {
  setTimeout(livereload.changed, 1000);
});

文档：setTimeout