Question

在过去对gulp 3的一些经验之后，我第一次使用gulp 4。我为项目设置了一个gulp构建，尽管它对其他所有功能都很好，但只是拒绝观看任何html更改并在更改时重新加载页面。运行gulp watch时，我没有任何错误，也没有在终端中获取标准的“从./dist提供文件”。

它正在工作，但是我必须进行了一些更改，但无法解决问题！

// bs
function browserSync(done) {
  server.init({
    server: {
      baseDir: "./dist"
    }
  });
  done();
}

// reload
function reload(done) {
  server.reload();
  done();
}

// html task
function html() {
  const out = `${dist}/`;

  return gulp
    .src(`${src}/**/*.html`)
    .pipe(newer(out))
    .pipe(devBuild ? noop() : htmlclean())
    .pipe(gulp.dest(out));
}

// watch for file changes
function watch(done) {
  // html changes
  gulp.watch(`${src}/**/*.html`, gulp.series(html, reload));
  // css changes
  gulp.watch(`${src}/scss/**/*`, gulp.series(css));
  // js changes
  gulp.watch(`${src}/js/**/*`, gulp.series(js));
  //sw changes
  gulp.watch(`${src}/sw.js`, gulp.series(sw));

  done();
}

exports.watch = gulp.parallel(watch, browserSync);

我希望任务能够复制到我的html文件中，并且服务器会刷新并包含我的html更改

Answer 1

我在构建任务中缺少对导出的引用。不知道这是否会影响它，但我也删除了浏览器缓存，它似乎又开始工作了。不确定是否要解决此问题，但案例解决了，如果将来有帮助的人可以阅读。

exports.build = gulp.series(
  exports.clean,
  gulp.parallel(
    exports.favicon,
    exports.fonts,
    exports.html,
    exports.css,
    exports.js,
    exports.sw
  )
);

编辑*：原来我正在从服务人员中加载资产，却完全忘记了在刷新时重新加载Chrome以进行SW开发！

我无法弄清楚为什么我的gulp文件没有观看我的html文件？

1 个答案: