浏览器不会使用 gulp 和 livereload 重新加载

Question

如果这看起来像是一个重复的问题，请原谅我，但我已经阅读了我能找到的所有资源来帮助我确定问题的根源。

我正在尝试让 gulp 重新加载 Chrome 在我编译了一个 jade 文件之后。我的 gulpfile.js:

var gulp       = require('gulp'),
    jade       = require('gulp-jade'),
    connect    = require('gulp-connect');

gulp.task('jade', function() {
   return gulp.src('src/*.jade')
      .pipe(jade({pretty: true}))
      .pipe(gulp.dest('dev/'))
      .pipe(connect.reload())
});

gulp.task('connect', function() {
   connect.server({
      livereload: true,
      root: 'dev',
      debug: true
   });
})

gulp.task('watch', function() {
   gulp.watch('src/*.jade', ['jade']);
});

gulp.task('default', ['connect', 'watch']);

我的文件结构是：

.
├── dev/
│   └── index.html
├── node_modules/
├── src/
│   └── index.jade
├── gulpfile.js
└── package.json

在命令行中输入 gulp 后，一切似乎都很好；我的 jade 文件会在保存时编译，但是 Chrome 不会刷新。几点说明：

我在 chrome 上安装了 LiveReload 扩展，当我在 http://localhost:8080
我在 LiveReload 扩展的 Chrome 扩展首选项中启用了 "Allow Access to File URLS"。
当 gulp 为运行、http://localhost:35729 returns 则 json {"tinylr":"Welcome","version":"0.2.1"}.
我在 Windows 和 Linux 上都试过了，但都没有成功。

有什么建议吗？

Answer 1

Livereload 在 gulp-connect 的较新版本中似乎无法可靠地工作，请参阅 Livereload is broken since 3.0.0。

我使用 gulp-connect@3.1.1 尝试了你的 Gulpfile，但我也无法让 livereload 工作。然而，按照链接问题线程中的建议回退到 gulp-connect 版本 2.3.1 确实解决了问题。可能值得一试。

Answer 2

在我的例子中，浏览器没有刷新，因为我已经 另一个 phpStorm 实例运行 livereload。所以，请确保您只运行它一次。

浏览器不会使用 gulp 和 livereload 重新加载

Browser doesn't reload with gulp and livereload

node.js

gulp

pug