Gulp 4: watch task has to be a function

Question

I have a problem with the watch task on SCSS using Gulp 4. I've looked at the documentation on gulp-sass and the various threads on the topic but still I must be making some very banal mistake, as I always receive the error

Error: watching ./assets/css/app.scss: watch task has to be a function (optionally generated by using gulp.parallel or gulp.series)

This is my code

`

'use strict';

const gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));

function buildStyles() {
  return gulp.src('./assets/css/app.scss')
    .pipe(sass.sync().on('error', sass.logError))
    .pipe(gulp.dest('.'));
};

exports.buildStyles = buildStyles;

gulp.task('watch', function () {
  gulp.watch('./assets/css/app.scss', ['sass']);
});

exports.default = gulp.series('watch');

`

How can I make this task run, as default task? Thank you very much in advance

Answer 1

I answer my own question: the correct code was this

'use strict';

const gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));

gulp.task('styles', function () {
  return gulp.src('./assets/css/app.scss')
     .pipe(sass.sync().on('error', sass.logError))
     .pipe(gulp.dest('.'));
});


gulp.task('watch', function () {
  gulp.watch('./assets/css/app.scss', gulp.series('styles'));
});

// Default Task
gulp.task('default', gulp.parallel('watch'));