CODEWITHSUNDEEP
javascriptgulpgulp-concatgulp-uglify
Mister_L
Mister_L

Reputation: 2611

gulp - concat to existing file

I'm using gulp to minify and concatenate my js. Currently this is my gulpfile:

var gulp = require('gulp'),
    gp_concat = require('gulp-concat'),
    gp_uglify = require('gulp-uglify'),

gulp.task('js-concat-and-minify', function() {
    return gulp.src([
        './public/assets/bower_components/jquery/dist/jquery.js',
        './public/assets/bower_components/bootstrap/dist/js/bootstrap.js',
        './public/assets/bower_components/angular/angular.js',
        './public/assets/bower_components/angular-route/angular-route.js',
        './public/assets/bower_components/angular-cookies/angular-cookies.js',
    './public/app/**/*.js'
    ])
    .pipe(gp_concat('bundle.min.js'))
    .pipe(gulp.dest('./public/'))
    .pipe(gp_uglify())
    .pipe(gulp.dest('./public/'))
});

// default task...

The thing is this: each of the angular/jquery/bootstrap files already has a minified version, so I don't want to minify them each time. I want to take the minified versions of angular/jquery/bootstrap, concatenate them to a single file, then minify my own js files located under './public/app/**/*.js' and concatenate them to the same single file with my libraries above. How do I do it?

Thanks.

Upvotes: 0

Views: 1569

Answers (1)

Eran Shabi
Eran Shabi

Reputation: 14979

You can separate your task into three tasks. The first task will bundle all the minified vendor files, and then put the result in a temporary folder. The second task will both bundle and minify you not minified files. Then in your third task (the one that you call) make a dependency to the first two and bundle the result.

gulp.task('bundleVendors', function() {
    return gulp.src([*your already minified files*])
    .pipe(gp_concat('bundle.min.js'))
    .pipe(gulp.dest('./temp/'));
}

gulp.task('bundleAndMinifyAppJs', function() {
    return gulp.src([*your not minified files*])
    .pipe(gp_concat('app.min.js'))
    .pipe(gp_uglify())
    .pipe(gulp.dest('./temp/'));
});

gulp.task('js-concat-and-minify', ['bundleVendors', 'bundleAndMinifyAppJs'], function() {
    return gulp.src(['./temp/app.min.js', './temp/bundle.min.js'])
    .pipe(gp_concat('bundle.min.js'))
    .pipe(gulp.dest('./public/'));
});

Upvotes: 1

Related Questions