Why don't the new uploaded files start my gulp -watch task?

Question

I have a gulp task that uses gulp -imagemin to compress images. When I add new files to this directory, I would like this task to compress them. I read that gulp.watch does not start in new files and that I should try gulp -watch, so I used it like this:

gulp.task('images', function() { watch({glob: './source/images/*'}, function (files) { return files .pipe(plumber()) .pipe(imagemin({ progressive: true, interlaced: true })) .pipe(gulp.dest('./www')); }); }); 

This works the same as gulp.watch on first start, but when I add a new image to the directory, nothing happens. However, if I overwrite an existing file, it starts the task again, so it behaves differently.

The documentation on gulp -watch caused this "batch mode" and said that I can also run a task for each file, so I also tried this method:

 gulp.task('images', function() { gulp.src('./source/images/*') .pipe(watch()) .pipe(plumber()) .pipe(imagemin({ progressive: true, interlaced: true })) .pipe(gulp.dest('./www')); }); 

But nothing has changed. Why isn’t the file added to the image directory that launches the task?

Answer 1

Most likely, such questions are redirected to the gaze package and its internal processes that perform complex viewing procedures in your OS. In this case, you should transfer images/**/* to the glob-version, so gaze will look at all (including new) files in the image directory:

 var gulp = require('gulp'); var watch = require('gulp-watch'); var imagemin = require('gulp-imagemin'); gulp.task('default', function() { watch({glob: 'images/**/*'}, function (files) { files.pipe(imagemin({ progressive: true, interlaced: true })) .pipe(gulp.dest('./www')); }); }); 

But this fills the unfixed case when you have an empty image directory. If you want to see them, go ['images', 'images/**/*'] to glob and it will look at a directory that is initially empty.

Ps also you do not need gulp-plumber in this case, because the clock will restart the function that uses imagemin every time, even when imagemin gives an error message.

Answer 2

Adding an additional argument {cwd:'./'} to gulp.watch worked for me:

 gulp.watch('src/js/**/*.js',{cwd:'./'},['scripts']); 

2 things to make it work:

1 Avoid ./ in file / folder templates

2 Provide ./ cwd value

Good luck.

Link: - stack overflow