Почему gulp-watch не удаляет файлы

Question

Я пытаюсь удалить задачу из файла /dest, когда я удалю их из /src, но это не сработает. Где ошибка?

var watch = require('gulp-watch'); 
 
var imagemin = require('gulp-imagemin'); 
 
var del = require('del'); 
 
var pngquant = require('gulp-pngquant'); 
 

 
var imgSrc = 'src/img/**'; 
 
var imgDst = 'build/img'; 
 

 
gulp.task('del', function() { 
 
    return del('build'); 
 

 
}); 
 

 
gulp.task('img', function() { 
 
    return gulp.src(imgSrc) 
 
    .pipe(debug({title: 'src'})) 
 
    //.pipe(newer(imgDst)) 
 
    .pipe(imagemin()) 
 
    .pipe(debug({title: 'imagemin'})) 
 
    .pipe(gulp.dest(imgDst)) 
 
    .pipe(debug({title: 'dest'})); 
 
}); 
 

 
gulp.task('watch', function() { 
 
    var watcher = gulp.watch(imgSrc, ['img']); 
 

 
    watcher.on('change', function (event) { 
 
     if (event.type === 'deleted') { 
 
      var filePathFromSrc = path.relative(path.resolve(imgSrc), event.path); 
 
      var destFilePath = path.resolve(imgDst, filePathFromSrc); 
 
      del.sync(destFilePath); 
 
     } 
 
    }); 
 
});

Answer 1

Ваши destFilePath указывает на файл, который не существует. Если вы удалите файл src/img/foo.png, то ваша destFilePath переменная заканчивается, указывая на build/foo.png вместо build/img/foo.png (в этом ваша задача img).

Причина в том, что вы применяете path.relative() к imgSrc, который содержит **. Однако path.relative() не отменяет глобусы. Он просто интерпретирует ** как обычное имя каталога. Таким образом, вы в конечном итоге отключите один каталог.

Вы должны оставить из ** при использовании path.relative():

if (event.type === 'deleted') { 
    var filePathFromSrc = path.relative(path.resolve('src/img'), event.path); 
    var destFilePath = path.resolve(imgDst, filePathFromSrc); 
    del.sync(destFilePath); 
}