Search code examples
javascriptgulpgulp-concat

gulp tasks - concatenate files that created by another gulp task


I want to minify my js files in my /_dev folder then rename them and copy hem to minify-js folder, then concatenate minified files.

I use a gulpfile.js like this:

var gulp = require('gulp'),
uglify = require('gulp-uglify'),
rename = require('gulp-rename'),
concat = require('gulp-concat');

gulp.task('minify-js', function() {
        return gulp.src('_dev/js/libraries/*.js')
            .pipe(uglify())
            .pipe(rename({
                suffix: '.min'
            }))
            .pipe(gulp.dest('minifiedJS'));
});

gulp.task('concatFiles',['minify-js'],function (){
     return gulp.src(['minifiedJS/jquery.jplayer.min.js', 'minifiedJS/jplayer.playlist.min.js', 'minifiedJS/LinkToPlayer.min.js'])
         .pipe(concat('final.js'))
        .pipe(gulp.dest('_dist/js'));
});

when I run:

gulp concatFiles

minify-js task create the following file in minifiedJSfolder.

jquery.jplayer.min.js
jplayer.playlist.min.js
LinkToPlayer.min.js

but final.js won't create till I run gulp concatFiles command again.

how can i solve this problem?


Solution

  • You may try in one task as following

    var gulp = require('gulp'),
        uglify = require('gulp-uglify'),
        rename = require('gulp-rename'),
        concat = require('gulp-concat');
    
    gulp.task('minify-js', function(){
        return gulp.src('_dev/js/libraries/*.js')
            .pipe(concat('concat.js'))
            .pipe(gulp.dest('dist'))
            .pipe(rename('final.js'))
            .pipe(uglify())
            .pipe(gulp.dest('dist'));
    });
    
    gulp.task('default', ['minify-js'], function(){});