Gulp4 destに移動し終わった後で通知する

よく忘れるので備忘録的にメモ

以下だとwebpの処理が始まったタイミングで通知されてしまう。

//Gulpfile v4

import gulp from 'gulp';
const { src, dest } = gulp;
import webp from 'gulp-webp';
import notifier from 'node-notifier';
import rename from 'gulp-rename';

export function imageWebp(done) {
    const _src = 'assets/img/';
    src(_src + '**/*.{jpg,png,jpeg}')
        .pipe(rename(function(path) {
            path.basename += path.extname;
        }))
        .pipe(webp({
            quality: 70,
            method: 6,
        }))
        .pipe(gulp.dest(_src));

       notifier.notify('webp 終わったっす。');

       done();
}

destでファイルの設置がすべて終わったタイミングで通知をしたい場合、on('end',function(){ / 通知など / }) をする必要がありました。

// ~ 省略

export function imageWebp(done) {
    const _src = 'assets/img/';
    src(_src + '**/*.{jpg,png,jpeg}')
        .pipe(rename(function(path) {
            path.basename += path.extname;
        }))
        .pipe(webp({
            quality: 70,
            method: 6,
        }))
        .pipe(gulp.dest(_src))
        .on('end',function{ notifier.notify('webp 終わったっす。'); done(); }); //ここを追記

       /* 以下は削除
       notifier.notify('webp 終わったっす。');
       done();
      */
}

てな感じで、すべての対象ファイルのwebpファイル化が終わったタイミングで通知を送ることができました。 たぶん何回もやってるんですが、整備する度に忘れるので、自戒ingの記事投稿となりました。