gulp-watch

I'm extremely new to Gulp. I'm basically trying to watch for a modified JavaScript file, and then make a new copy of it with a new name. (eventually there'll be some processing on it, but Rome wasn't built in a day). My (naive) attempt is this: gulp.task('default', function() { return gulp.watch('../**/**.js', function(obj){ gulp.src(obj.path) .pipe(gulp.dest('foobar.js')); }); }); This takes the modified file and successfully copies it into a folder now called foobar.js. Is there anything simple I can replace gulp.dest('foobar.js') with that will simply copy and rename the src file in place?

I've been using gulp-watch. The current version of gulp-watch relies on the call gulp.parrallel. This call is only available from gulp 4. However gulp 4 is not available via the npm repo. npm info gulp dist-tags returns: { latest: '3.9.0' } . I can see that there is a 4.0 branch within the git repo. But attempting to install it with variations on this command fails: npm install https://github.com/gulpjs/gulp#v4.0.0 . Andor Lundgren npm install gulpjs/gulp.git#4.0 --save-dev Gulp has removed the 4.0 branch from their GitHub repository, so the previous way of installing using npm install gulpjs

I have the current gulp task which I use in a gulpfile. Path are from a config.json and everything works perfectly: //Some more code and vars... gulp.task('watch', function() { gulp.watch([config.path.devfolder+"/**/*.png", config.path.devfolder+"/**/*.jpg", config.path.devfolder+"/**/*.gif", config.path.devfolder+"/**/*.jpeg"], ['imagemin-cfg']); }) //Some more code ... gulp.task('imagemin-cfg', function () { return gulp.src([config.path.devfolder+"/**/*.png", config.path.devfolder+"/**/*.jpg", config.path.devfolder+"/**/*.gif", config.path.devfolder+"/**/*.jpeg"], {read: false}) .pipe

I have something like this: gulp.task('default', ['css', 'browser-sync'] , function() { gulp.watch(['sass/**/*.scss', 'layouts/*.css'], function() { gulp.run('css'); }); }); but it does not work, because it watches two directories, the sass and the layouts directory for changes. How do I make it work, so that gulp watches anything that happens inside those directories? gulp.task('default', ['css', 'browser-sync'] , function() { gulp.watch(['sass/**/*.scss', 'layouts/**/*.css'], ['css']); }); sass/**/*.scss and layouts/**/*.css will watch every directory and subdirectory for any changes to

I have the following setup: // watch for changes gulp.task('watch', function () { gulp.watch('./assets/**/*.less', ['compile-less']); }); gulp.task("compile-less", () => { return gulp.src('./assets/build-packages/*.less') .pipe($.less({ paths: [ $.path.join(__dirname, 'less', 'includes') ] })) .pipe(gulp.dest(OutputPath)); // ./dist/styles/ }); So basically every time a developer changes something in a less file it runs the task 'compile-less'. The task 'compile-less' builds our package less files (including all the @imports). The first change in a random less file works, all the less files

With gulp you often see patterns like this: gulp.watch('src/*.jade',['templates']); gulp.task('templates', function() { return gulp.src('src/*.jade') .pipe(jade({ pretty: true })) .pipe(gulp.dest('dist/')) .pipe( livereload( server )); }); Does this actually pass the watch'ed files into the templates task? How do these overwrite/extend/filter the src'ed tasks? I had the same question some time ago and came to the following conclusion after digging for a bit. gulp.watch is an eventEmitter that emits a change event, and so you can do this: var watcher = gulp.watch('src/*.jade',['templates']);