2016-07-09 7 views
0

/srcからファイルを削除するときに、/destディレクトリからファイルを削除するgulp-watchタスクを作成しようとしていますが、動作しません。 間違いはどこですか?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

は理解できないでしょう。ビルドを開始する前にdeleteを使用する方がよいでしょう。 – varit05

答えて

0

存在しないファイルへのあなたのdestFilePathポイント。ファイルsrc/img/foo.pngを削除した場合、build/img/foo.pngimgタスクが置いた場所)の代わりに、を指す変数destFilePathが終了します。

の理由は、あなたが**を含むimgSrcpath.relative()を適用していることです。しかし、path.relative()はグロブを理解しません。これは通常のディレクトリ名として**を解釈するだけです。だから1つのディレクトリになってしまいます。あなたは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'が空であるかどうかにかかわらず)。 –

関連する問題