1

Hi everyone I hope you having a great day, I'm trying to find a way on how do I make a min file in the same path or gulp.dest() on gulp(gulp-uglify and gulp-rename). In my code below when I run my gulp it keeps on creating *.min.js , *.min.min.js , *.min.min.min.js so on and so forth unless I stop the terminal. How do I make my gulp create only one *.min.js at the same time it uglify's. I hope everyone can help me with this one. Thank You.

const gulp = require('gulp');
const browserSync = require('browser-sync').create();
const rename = require('gulp-rename');
const uglify = require('gulp-uglify');

gulp.task('scripts', function() {
    return gulp.src('./src/js/*.js')       
        .pipe(uglify())
        .pipe(rename( {suffix: '.min'} ))
        .pipe(gulp.dest('./src/js/'))
        .pipe(browserSync.stream());
});

gulp.task('browserSync', function(){

    browserSync.init({
        server : {
            baseDir : './'
        }
    });
    gulp.watch('./src/js/**.js', gulp.series('scripts'));
});

gulp.task('default', gulp.series('scripts', 'browserSync'));
jricc russel
  • 61
  • 3
  • 9

1 Answers1

2

This is happening because your scripts task is outputting the files to the same directory as you are watching:

.pipe(gulp.dest('./src/js/'))

and 

gulp.watch('./src/js/**.js', gulp.series('scripts'));

So every time scripts runs and saves to that directory it triggers your watch again which fires scripts, etc., etc.

So either save your .min's to a directory you are not watching or don't watch .min files.

BTW, change to gulp.watch('./src/js/*.js', gulp.series('scripts')); // removed one asterisk

gulp.watch(['./src/js/*.js', '!./src/js/*.min.js'], gulp.series('scripts')); // might work - untested though.

Mark
  • 143,421
  • 24
  • 428
  • 436
  • Thank you Mark I just change my `.pipe(gulp.dest('./src/js/'))` to `.pipe(gulp.dest('./src/js/min/'))` to put my min files to a different path in the case on `gulp.watch(['./src/js/*.js', '!./src/js/*.min.js'], gulp.series('scripts'));` it still keeps on generate `*.min.js` so on and so forth , but I still looking forward putting my min file in the same folder. – jricc russel Feb 11 '20 at 00:35
  • Hi Mark I just play around the with my gulpjs.file since you mention this line `gulp.watch(['./src/js/*.js', '!./src/js/*.min.js'], gulp.series('scripts'))` I figured out I put it also to the `gulp.src` the entire line: `return gulp.src(['./src/js/*.js', '!./src/js/*.min.js']) ` and it works. Thank You – jricc russel Feb 14 '20 at 05:59
  • BTW Mark what is this `!` on the `!./src/js/*.min.js` how is it work? – jricc russel Feb 14 '20 at 06:02
  • The `!` is a negation indicator - so those files are not included in your watch list. So any `.min.js` files are skipped. – Mark Feb 14 '20 at 06:06