Why is gulp.watch only used 1 time?

Question

Node.js

Good evening. The last time I used Gulp was version 3. Now I downloaded Gulp 4, created automation and nothing worked. I corrected the code (added gulp.series) and, it seems, everything worked. But the problem is that gulp.watch only fires once, and modifying the file again no longer calls task. In other words, I launched the watcher, made changes to the file, saved it, everything was updated, made the changes again and nothing happens, although the watcher is active. I have 3 watchers hanging in my task, these are on jade, sass and js. the steps described above apply to each file type, i.e. if I change the jade file, the watcher will notice the changes and will no longer work with this file type, but I can make changes to js, ​​for example, but also only 1 time. Tell me what needs to be fixed, because in version 3 everything worked adequately, but in Node.
Here are the task snippets:
gulp.task('jade', function() {
gulp.src(['src/jade/*.jade'])
.pipe(plumber())
.pipe(jade())
.pipe(gulp .dest('build/'))
.pipe(server.reload({stream: true}));
});
gulp.task('style', function() {
gulp.src(['src/sass/*.scss', '!src/sass/mixins.scss', '!src/sass/normalize.scss', ' !src/sass/variable.scss'])
.pipe(plumber())
.pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
.pipe(postcss([
autoprefixer (
{browsers: [
"last 1 version",
"last 2 Firefox versions",
"last 2 Opera versions",
"last 2 Edge versions"],
grid: true
})
]))
.pipe(gcmq())
.pipe(minify())
.pipe(gulp.dest ('build/css'))
.pipe(server.reload({stream: true}));
});
gulp.task('script', function() {
gulp.src('src/js/*.js')
.pipe(plumber())
.pipe(jsmin())
.pipe(gulp.dest('build/ js/'))
.pipe(server.reload({stream: true}));
});
gulp.task('hash', function() {
gulp.src('
.pipe(hash())
.pipe(gulp.dest('build'));
});
gulp.task('watcher', function() {
server.init({
server: 'build'
});
gulp.watch('src/sass/**/*.scss', gulp.series('style', 'hash'));
gulp.watch('src/**/*.jade', gulp.series('jade', 'hash'));
gulp.watch('src/js/*.js', gulp .series('script', 'hash'));
});

Answer 1

function compileJade(done) {
  gulp.src('src/jade/*.jade')
    .pipe(plumber())
    .pipe(jade())
    .pipe(gulp.dest('build/'))
    .pipe(server.reload({ stream: true }));
  
  
  done()
}

function compileScss(done) {
  gulp.src([
    'src/sass/*.scss',
    '!src/sass/mixins.scss',
    '!src/sass/normalize.scss',
    '!src/sass/variable.scss'
  ])
    .pipe(plumber())
    .pipe(sass({ outputStyle: 'compressed' }).on('error', sass.logError))
    .pipe(postcss([
      autoprefixer({
        browsers: [
          "last 1 version",
          "last 2 Chrome versions",
          "last 2 Firefox versions",
          "last 2 Opera versions",
          "last 2 Edge versions"
        ],
        grid: true
      })
    ]))
    .pipe(gcmq())
    .pipe(minify())
    .pipe(gulp.dest('build/css'))
    .pipe(server.reload({ stream: true }));
  
  
  done()
}

function compileScripts(done) {
  gulp.src('src/js/*.js')
    .pipe(plumber())
    .pipe(jsmin())
    .pipe(gulp.dest('build/js/'))
    .pipe(server.reload({ stream: true }));
  
  
  done()
}

function makeHash(done) {
  gulp.src('build/index.html')
    .pipe(hash())
    .pipe(gulp.dest('build'));
  
  
  done()
}

function watcher(done) {
  server.init({
    server: 'build'
  });
  
  gulp.watch('src/sass/**/*.scss', gulp.series(compileScss, makeHash));
  gulp.watch('src/**/*.jade', gulp.series(compileJade, makeHash));
  gulp.watch('src/js/*.js', gulp.series(compileScripts, makeHash));
  
  
  done()
}

module.exports = {
  default: watcher,
  watcher,
  build: gulp.series(
    compileJade,
    compileScss,
    compileScripts,
    makeHash
  ),
  jade: compileJade,
  style: compileScss,
  script: compileScripts,
  hash: makeHash
}