My gulpfile works well but when calling the watch task and then making a change to a watched file it only seems to run once and then no longer watches the file.

I have tried using callbacks but it doesn't seem to resolve my situation. I have recently changed from Gulp 3 to 4 and I am possibly missing a core piece of functionality.

// Load plugins
const gulp = require("gulp");
const sass = require('gulp-sass')(require('sass'))

// CSS task
function css() {
    process.chdir('./ui/src/sass/'); // Change current working directory
    return gulp.src('**/*.scss')
      .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
      .pipe(gulp.dest('../../dist/css/'));
}

// Watch files
function watchFiles() {
  gulp.watch( 'ui/src/sass/**/*.scss' ).on( 'change', gulp.series(css));
}

const watch = gulp.parallel(watchFiles);

// export tasks
exports.css = css;
exports.watch = watch;