Автоматическое обновление страницы с помощью browser-sync не происходит. Почему?

Question

[Igor Rodichev]

Здравствуйте! Автоматическое обновление страницы с помощью browser-sync не происходит. Причем страница в браузере открывается, но при внесении изменений автоматически не обновляется. В чем может быть причина?

const gulp = require("gulp");
const browserSync = require("browser-sync");
const sass = require("gulp-sass");
const rename = require("gulp-rename");
const cleanCSS = require('gulp-clean-css');

// Static server
gulp.task("server", function () {
  browserSync.init({
    server: {
      baseDir: "src"
    },
    browser: 'chrome'
  });
});

gulp.task("styles", function () {
  return gulp.src("src/sass/*.+(scss|sass)")
    .pipe(sass({
      outputStyle: "compressed"
    }).on("error", sass.logError))
    .pipe(rename({
      prefix: "",
      suffix: ".min",
    }))
    .pipe(cleanCSS({compatibility: 'ie8'}))
    .pipe(gulp.dest("src/css"))
    .pipe(browserSync.stream());
});

gulp.task("watch", function () {
  gulp.watch("src/sass/*.+(scss|sass)", gulp.parallel("styles"));
  gulp.watch("/src/*.html").on("change", browserSync.reload);
});

gulp.task("default", gulp.parallel("watch", "server", "styles"));

Answer 1

[Никита Кит]

1) var browserSync = require('browser-sync').create();
2) По-моему watch().on() - это из 3го gulp, а у тебя тут явно 4й.
Присмотрись к докам повнимательнее. Попробуй передать отдельный таск в watch для reload

Answer 2

[Igor Rodichev]

Вот решение, которое помогло https://codepen.io/codepen-store/pen/gOYKmRw?edito...