Doubt when migrating Gulp code

Question

Good evening, I would like to know how to update this code snippet from Gulp 3 to Gulp 4. Everything before worked perfectly, I was updating the lib for vulnerabilities and now appears the following error: (I could not understand the documentation migration)

const gulp = require('gulp');
const clean = require('gulp-clean');
const ts = require('gulp-typescript');

const tsProject = ts.createProject('tsconfig.json');

gulp.task('scripts', ['static'], () => {
    const tsResult = tsProject.src()
        .pipe(tsProject());

    return tsResult.js
        .pipe(gulp.dest('dist'));
});

gulp.task('static', ['clean'], () => {
    return gulp
        .src(['src/**/*.json'])
        .pipe(gulp.dest('dist'));
});

gulp.task('clean', () => {
    return gulp
        .src('dist')
        .pipe(clean());
});

gulp.task('build', ['scripts']);

gulp.task('watch', ['build'], () => {
    return gulp.watch(['src/**/*.js', 'src/**/*.json'], ['build']);
});

gulp.task('default', ['watch']);

Answer 1

From the Gulp documentation, it seems that the biggest change in the API is that you now decide whether scripts should run in order or in parallel, so instead of using this syntax:

// Gulp 3
gulp.task('scripts', ['static'], () => {
    const tsResult = tsProject.src()
        .pipe(tsProject());

    return tsResult.js
        .pipe(gulp.dest('dist'));
});

You will use this:

// Gulp 4
gulp.task('scripts', gulp.series('static', () => {
    const tsResult = tsProject.src()
        .pipe(tsProject());

    return tsResult.js
        .pipe(gulp.dest('dist'));
}));

Or even, if the order of execution of the scripts does not matter, you can run them in parallel with:

// Gulp 4
gulp.task('scripts', gulp.parallel('static', () => {
    const tsResult = tsProject.src()
        .pipe(tsProject());

    return tsResult.js
        .pipe(gulp.dest('dist'));
}));

Answer 2

Thanks for the help, I managed to get to the following code:

const gulp = require('gulp');
const clean = require('gulp-clean');
const ts = require('gulp-typescript');

const tsProject = ts.createProject('tsconfig.json');

gulp.task('clean', () => {
    return gulp
        .src('dist/*')
        .pipe(clean());
});

gulp.task('static', gulp.series('clean', () => {
    return gulp
        .src(['src/**/*.json'])
        .pipe(gulp.dest('dist'));
}));

gulp.task('scripts', gulp.series('static', () => {
    const tsResult = tsProject.src()
        .pipe(tsProject());

    return tsResult.js
        .pipe(gulp.dest('dist'));
}));

gulp.task('build', gulp.series('scripts'));

gulp.task('watch', () => {
    return gulp.watch(['src/**/*.ts', 'src/**/*.json'], gulp.series('build'));
});

gulp.task('default', gulp.series('build','watch'));

The problem is in the terminal, where it is shown some messages about its execution. In these messages a , instead of appearing the proper task name.