gulp watch запуск таска на слежение

Прошу помочь в чем может быть проблема. Создал свою сборку gulp для веб разработки. Суть такая: есть таск обработки фото imagesDev, он берет фото из src\assets\images и обрабатывая кладет их в build\images, после чего запускается другой таск webpConvert который фото png / jpg переводит в формат webp. При запуске всего таска все отрабатывает нормально, но когда таск находится в режиме отслеживания, добавление нового фото - запускается таск imagesDev и переносит фото в build\images. Проблема: после того как фото появилось в build\images должен запуститься webpConvert но он не стартует..... и чтобы появился файл webp от нового файла надо полностью перезапускать сборку.

вот gulp file

// 'use strict'

// common
import gulp, { parallel } from 'gulp'
const { src, dest, watch, series } = gulp;

import del from 'del';
import plumber from 'gulp-plumber';
import notify from 'gulp-notify';
import changed from 'gulp-changed';

import syncServer from 'browser-sync';
const sync = syncServer.create();

// images
// import imagemin, { gifsicle, mozjpeg, optipng, svgo } from 'gulp-imagemin';
// import imagemin from 'imagemin';
import imagemin from 'gulp-imagemin';
import recompress from 'imagemin-jpeg-recompress';
import pngquant from 'imagemin-pngquant';
import imageminWebp from 'imagemin-webp';
import webp from 'gulp-webp';

// fonts
import ttf2woff2Gulp from 'gulp-ttf2woff2';

// html
import include from 'gulp-file-include';
import autoprefixer from 'gulp-autoprefixer';
import * as dartSass from 'sass';
import gulpSass from "gulp-sass";
const sass = gulpSass(dartSass);
import cssbeautify from 'gulp-cssbeautify';
import cssnano from 'gulp-cssnano';
import removeComments from 'gulp-strip-css-comments';
import rename from 'gulp-rename';
import rigger from 'gulp-rigger';
import uglify from 'gulp-uglify';
import formatHTML from 'gulp-format-html';

/* пути */
const srcPath = "src/"
const buildPath = "build/"
const docsPath = "docs/"

const path = {
    build: {
        html: buildPath,
        css: buildPath + "css/",
        js: buildPath + "js/",
        images: buildPath + "images/",
        fonts: buildPath + "fonts/"
    },
    prod: {
        html: docsPath,
        css: docsPath + "css/",
        js: docsPath + "js/",
        images: docsPath + "images/",
        fonts: docsPath + "fonts/"
    },
    src: {
        html: srcPath + "/**/*.html",
        css: srcPath + "assets/scss/*.scss",
        js: srcPath + "assets/js/*.js",
        images: srcPath + "assets/images/**/*.{jpg,png,svg,gif,ico,webp}",
        fonts: srcPath + "assets/fonts/**/*.{eot,woff,woff2,ttf}"
    },
    watch: {
        html: srcPath + "/**/*.html",
        css: srcPath + "assets/scss/*.scss",
        js: srcPath + "assets/js/*.js",
        images: srcPath + "assets/images/**/*.{svg,jpg,png,gif,ico,webp}",
        fonts: srcPath + "assets/fonts/**/*.{eot,woff,woff2,ttf}"
    },
    cleanDev: "./" + buildPath,
    cleanDocs: "./" + docsPath
}

/* конфиги */
const includeConfig = {
    prefix: '@@',
    basepath: '@root',
}

// const imageminConfig = [
//     gifsicle({ interlaced: true }),
//     mozjpeg({ quality: 85, progressive: true }),
//     optipng({ optimizationLevel: 5 }),
//     svgo({
//         plugins: [
//             {
//                 name: 'removeViewBox',
//                 active: true
//             },
//             {
//                 name: 'cleanupIDs',
//                 active: false
//             }
//         ]
//     })
// ]
const imageminConfig2 = {
    destination: buildPath +'images/',
    plugins: [
        imageminWebp({ quality: 50 })
    ]
}

const plumberNotify = (title) => {
    return {
        errorHandler: notify.onError({
            title: title,
            message: 'Error <%= error.message %>',
            sound: false
        }),
    };
}

// таски
function serveDev() {
    sync.init({
        server: {
            baseDir: "./" + buildPath
        }
    })
}

function serveDocs() {
    sync.init({
        server: {
            baseDir: "./" + docsPath
        }
    })
}
function htmlDev() {
    return src(path.src.html, {base: srcPath})
        .pipe(plumber(plumberNotify('HTML')))
        .pipe(include(includeConfig))
        .pipe(formatHTML())
        .pipe(dest(path.build.html))
        .pipe(sync.reload({stream: true}));
}

function htmlDocs() {
    return src([path.src.html, '!./src/blocks/*.html'])
        .pipe(plumber(plumberNotify('HTML')))
        .pipe(include(includeConfig),
        )
        .pipe(dest(path.prod.html))
        .pipe(sync.reload({ stream: true }));
}

function cssDev() {
    return src(path.src.css, {base: srcPath + "assets/scss"})
        .pipe(plumber(plumberNotify('Styles')))
        .pipe(sass())
        .pipe(autoprefixer())
        .pipe(cssbeautify())
        .pipe(rename({
            suffix: ".min",
            extname: ".css"
        }))
        .pipe(dest(path.build.css))
        .pipe(sync.reload({ stream: true }));
}

function cssDocs() {
    return src(path.src.css, { base: srcPath + "assets/scss/" })
        .pipe(plumber(plumberNotify('Styles')))
        .pipe(sass())
        .pipe(autoprefixer())
        .pipe(cssbeautify())
        .pipe(cssnano({
            zindex: false,
            discardComments: {
                removeAll: true
            }
        }))
        .pipe(removeComments())
        .pipe(rename({
            suffix: ".min",
            extname: ".css"
        }))
        .pipe(dest(path.prod.css))
        .pipe(sync.reload({ stream: true }));
}

function fontsDev() {
    return src(path.src.fonts, {
        base: srcPath + "assets/fonts", encoding: false, removeBOM: false,
})
        .pipe(ttf2woff2Gulp())
        .pipe(dest(path.build.fonts))
}

function jsDev() {
    return src(path.src.js, {base: srcPath + "assets/js"})
        .pipe(plumber(plumberNotify('JS')))
        .pipe(rigger())
        .pipe(uglify())
        .pipe(rename({
            suffix: ".min",
            extname: ".js"
        }))
        .pipe(dest(path.build.js))
        .pipe(sync.reload({ stream: true }));
}

function jsDocs() {
    return src(path.src.js, { base: srcPath + "assets/js" })
        .pipe(plumber(plumberNotify('JS')))
        .pipe(rigger())
        .pipe(uglify())
        .pipe(rename({
            suffix: ".min",
            extname: ".js"
        }))
        .pipe(dest(path.prod.js))
        .pipe(sync.reload({ stream: true }));
}


function imagesDev() {
    return src(path.src.images, { base: srcPath + "assets/images/", encoding: false})
        .pipe(changed(buildPath + 'images/'))
        .pipe(imagemin(
            {
                interlaced: true,
                progressive: true,
                optimizationLevel: 5,
            },
            [
                recompress({
                    loops: 6,
                    min: 50,
                    max: 90,
                    quality: 'high',
                    use: [pngquant({
                        quality: [0.8, 1],
                        strip: true,
                        speed: 1
                    })],
                }),
                imagemin.gifsicle(),
                imagemin.optipng(),
                imagemin.svgo()
            ],),)
        .pipe(dest(path.build.images))
        .pipe(sync.reload({ stream: true }));
}

function webpConvert() {
    return src(buildPath + 'images/**/*.+(png|jpg|jpeg)')
        .pipe(plumber())
        .pipe(changed('build/images', {
            extension: '.webp'
        }))
        .pipe(webp())
        .pipe(dest(path.build.images))
        .pipe(sync.reload({ stream: true }));
}

function imagesDocs() {
    return src(path.src.images, { base: srcPath + "assets/images/", encoding: false})
        .pipe(imagemin(imageminConfig))
        .pipe(dest(path.prod.images))
        .pipe(sync.reload({ stream: true }));
}

function cleanDev() {
    return del(path.cleanDev)
}

function cleanDocs() {
    return del(path.cleanDocs)
}

function watchDev() {
    gulp.watch([path.watch.html], htmlDev)
    gulp.watch([path.watch.css], cssDev)
    gulp.watch([path.watch.js], jsDev)
    gulp.watch([path.watch.images], imagesDev) 
    gulp.watch([path.build.images], webpConvert) 
}

const build = series([cleanDev, parallel(imagesDev, htmlDev, cssDev, jsDev), webpConvert, fontsDev]);
const watcher = parallel(build, watchDev, serveDev)
const prod = series([cleanDocs, parallel(imagesDocs, htmlDocs, cssDocs, jsDocs, serveDocs)])
export { build, prod, watcher, webpConvert };