2016-07-09 43 views
0

我試圖讓我的gulp-watch任務從/dest目錄刪除文件,當我從/src中刪除它們時,但它不起作用。 錯誤在哪裏?爲什麼gulp-watch不會刪除文件

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); 
 
     } 
 
    }); 
 
});

+0

想不明白爲什麼你一飲而盡手錶刪除文件。在構建開始之前更好地使用刪除。 – varit05

回答

0

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); 
} 
+0

非常感謝您的回答,它解決了問題。但還有一個出現。當我用空src/img啓動gulp-watch時,沒有任何事情發生(當我將文件添加到src/img時,gulp-imagemin不會啓動),當我在src/img中啓動圖像時,只有在刪除文件後纔開始工作。我是JS的新手,所以如果你能給我一個解釋,我會很高興。 – BigKompot

+0

我沒有解釋。你所描述的不應該發生。我用你的gulpfile來查看我是否可以重現問題,並且將文件添加到'src/img'總是導致'img'任務運行(不管src/img'是否爲空)。 –

相關問題