How to make gulp remove deleted files while watching on a particular glob pattern?

Question

I have a gulp watch task over a glob, looking for changes and updating an output folder. It is successfully able to updated changed files, add new files but it fails to remove deleted files.

The callback looks like this:

var cb = function (event) {
  console.log('Moving assets...');    
  return gulp.src('app/assets/**/*', {base: 'app'})
    .pipe(changed('build/assets'))
    .pipe(gulp.dest('build'));
};

The gulp watch task is this:

gulp.watch('app/assets/**/*', cb);

I know that the gulp watch is running fine because the callback receives all the deleted events. But the callback itself is unable to remove the deleted file from the build/assets/ folder.

Do I have to explicitly handle the deleted event or am I missing something out?

Answer 1

The question is old, but I think it's still relevant.

Here is the solution I came up with, based on ondaplana answer in this github issue and the documentation of the gulp modules that are used:

Basically, it uses gulp-watch instead of gulp native watch function, to pipe gulp-filter and del modules.

var filter = require('gulp-filter');
var vinylPaths = require('vinyl-paths');
var del = require('del');
var watch = require('gulp-watch');

    var notDeletedFilter = filter(
        function(file) {
            return file.event !== 'unlink' && file.event !== 'unlinkDir';
        },
        {restore: true}
    );

    notDeletedFilter.restore
        .pipe(gulp.dest('dist'))
        .pipe(vinylPaths(del));

    //use gulp-watch instead of gulp native watch function
    watch(['app/assets/**/*'], {events: ['add', 'change', 'unlink', 'unlinkDir']})
        .pipe(notDeletedFilter)
        .pipe(anyModule())
        .pipe(gulp.dest('build'));

Documentation :

Gulp recipes