Почему прерывается таск styles gulp?

Question

[wether_report]

Собрал свою первую сборку gulp в жизни, по гайдам разумеется) Изначально всё было хорошо, но добавил ещё несколько плагинов к основным (gulp-imagemin, gulp-htmlmin, gulp-sourcemaps) и случилась такая беда, что после запуска задачи gulp.default изменения в scss никаким образом не отражаются в браузере, только перезапуск галпа помогает. Так же интересует вопрос почему функция на минификацию html не работает, если её добавить в таск build, а только отдельно. Всем спасибо!

const {src, dest, watch, parallel, series} = require('gulp');
const scss = require('gulp-sass')(require('sass'));
const concat = require('gulp-concat');
const browserSync = require('browser-sync').create();
const autoprefixer = require('gulp-autoprefixer');
const clean = require('gulp-clean');
const imagemin = require('gulp-imagemin');
const htmlmin = require('gulp-htmlmin');
const sourcemaps = require('gulp-sourcemaps');

function styles() {
    return src('src/sass/*.+(scss|sass)')
        .pipe(sourcemaps.init())
        .pipe(autoprefixer({overrideBrowserlist:['last 10 version']}))
        .pipe(concat('style.min.css'))
        .pipe(scss({outputStyle: 'compressed'}))
        .pipe(sourcemaps.write())
        .pipe(dest('src/css'))
        .pipe(browserSync.stream())
};

function watching() {
    watch(['src/sass/*.+(scss|sass)'], styles)
    watch(['src/**/*.html']).on('change', browserSync.reload)
};

function browsersync() {
    browserSync.init({
        server: {
            baseDir: "src/"
        }
    });
};

function html() {
    return src('src/**/*.html')
    .pipe(htmlmin({
        removeComments: true,
        collapseWhitespace: true 
    }))
    .pipe(dest('public'));
};

function images() {
    return src(['src/images/**/*'])
        .pipe(imagemin({progressive: true}))
        .pipe(dest('public/images'))
};

function building() {
    return src([
        'src/css/style.min.css',
        'src/**/*.html'
        
    ], {base: 'src'})
    .pipe(dest('public'))
};

function cleanPublic() {
    return src('public')
        .pipe(clean())
};

exports.styles = styles;
exports.watching = watching;
exports.browsersync = browsersync;
exports.html = html; //если надо сжать html, нужно прописать отдельно от build почему-то

exports.build = series(cleanPublic, html, images, building);
exports.default = parallel(styles, browsersync, watching);

вот структура проекта:

Answer 1

[Froggyweb]

function watching() {
    watch(['src/sass/**/*.+(scss|sass)'], styles)
    watch(['src/**/*.html']).on('change', browserSync.reload)
};