Help with Gulp, Watch files

JavaScript
1

Having trouble getting Gulp to do what I am aiming to do. I want to run a given task when a file has changed (basically transpile it and pipe it to my dist folder). My tasks world individually from the CLI, but I am having trouble figuring out how to get the ‘watch’ package to work. I’ve been looking through the npm docs for a while but I’m not having any luck. Any help would be appreciated. Also I can’t seem to find any docs for browser-sync either? Anyway, here’s my current gulp file:

const gulp = require('gulp');
const imagemin = require('gulp-imagemin');
const sass = require('gulp-sass');
sass.compiler = require('node-sass');
const uglify = require('gulp-uglify');
const babel = require('gulp-babel');
const watch = require('gulp-watch');


gulp.task('html', () => 
    gulp.src('./src/*.html')
        .pipe(gulp.dest('dist'))
);

gulp.task('sass', () =>
    gulp.src('./src/sass/*.sass')
        .pipe(sass().on('error', sass.logError))
        .pipe(gulp.dest('./dist/css'))
);


gulp.task('babel', () =>
    gulp.src('./src/js/*.es6')
        .pipe(babel({
            presets: ['@babel/env']
        }))
        .pipe(gulp.dest('./src/js'))
);

gulp.task('uglifyJS', () =>
    gulp.src('./src/js/*.js')
        .pipe(uglify())
        .pipe(gulp.dest('dist/js'))
);

gulp.task('imagemin', () => 
    gulp.src('./src/assets/images/*')
        .pipe(imagemin())
        .pipe(gulp.dest('./dist/assets/images'))
);

gulp.task('stream', () =>
        watch('./src', () => 
            gulp.series('html', 'sass', 'babel', 'uglifyJS', 'imagemin')
        )
);
2

As far as I understand gulp has a watch method built in - I’ve never needed an additional package for it. If you change watch('./src', () => { ... }) to gulp.watch('./src', () => { ... }), does that do any good?