It turns out that I needed to use gulp-rename and also output the concatenated file first before 'uglification'. Here's the code:
var gulp = require('gulp'),
gp_concat = require('gulp-concat'),
gp_rename = require('gulp-rename'),
gp_uglify = require('gulp-uglify');
gulp.task('js-fef', function(){
return gulp.src(['file1.js', 'file2.js', 'file3.js'])
.pipe(gp_concat('concat.js'))
.pipe(gulp.dest('dist'))
.pipe(gp_rename('uglify.js'))
.pipe(gp_uglify())
.pipe(gulp.dest('dist'));
});
gulp.task('default', ['js-fef'], function(){});
Coming from grunt it was a little confusing at first but it makes sense now. I hope it helps the gulp noobs.
And, if you need sourcemaps, here's the updated code:
var gulp = require('gulp'),
gp_concat = require('gulp-concat'),
gp_rename = require('gulp-rename'),
gp_uglify = require('gulp-uglify'),
gp_sourcemaps = require('gulp-sourcemaps');
gulp.task('js-fef', function(){
return gulp.src(['file1.js', 'file2.js', 'file3.js'])
.pipe(gp_sourcemaps.init())
.pipe(gp_concat('concat.js'))
.pipe(gulp.dest('dist'))
.pipe(gp_rename('uglify.js'))
.pipe(gp_uglify())
.pipe(gp_sourcemaps.write('./'))
.pipe(gulp.dest('dist'));
});
gulp.task('default', ['js-fef'], function(){});
See gulp-sourcemaps for more on options and configuration.
UPDATE - FEB 2022
These days, it may be easier for you to handle build tasks using Gulp4 and Async/Await functionality:
// gulpfile.js
const fs = require('fs/promises');
const concat = require('concat');
const uglify = require('uglify-js');
let files_arr = ['file1.js', 'file2.js', 'file3.js'];
async function myGulpTask()
{
var concat_str,
uglify_str
;
// concat content
concat_str = await concat(files_arr);
// save to file
await fs.writeFile('concat.js', concat_str, 'utf8');
// uglify content
uglify_str = await uglify.minify(concat_str, {mangle:false}).code;
// save to file
await fs.writeFile('uglify.js', uglify_str, 'utf8');
}
module.exports = {
myTask: myGulpTask
};
Then from the CLI:
gulp myTask
