I've used gulp for awhile now and It's also pretty easy. With fly you don't have to repeat your self several times like you do with gulp tasks. You just define out what you want and that's it. If it's a fly plugin it will be required
automatically without the need for an additional plugin. You can also run multiple subtasks in the same task in order without having to create a separate task.
This could be the only thing in your flyfile.js
and it would run perfectly. This will clear the previous JS, convert all the ES6 files to ES5 with babel, combine all the files, minify the combined file and output the file and the sourcemaps to the dist js directory.
3 total plugins require including fly it's self , 0 plugins that had to be required in the flyfile.js
, 1 task
// flyfile.js
export function *js(){
yield this.clear("dist/lib/js");
yield this.source("app/lib/js/**/*.js")
.babel({ // fly-babel
stage: 0,
sourceMap: true
})
.concat("bundle.min.js")
.uglify() // fly-uglify
.target("dist/lib/js");
}
Here's what the gulp version looks like to do exactly the same thing 6 total plugins required(including gulp), and 6 plugins you have to require in the gulpfile, and 2 separate tasks to complete the same thing
// gulpfile.js
var gulp = require("gulp"),
del = require("del"),
sourcemaps = require("gulp-sourcemaps"),
babel = require("gulp-babel"),
concat = require("gulp-concat"),
uglify = require("gulp-uglify");
gulp.task("js", ["js:clean"], function(){
return gulp.src("dist/lib/js/**/*.js")
.pipe(sourcemaps.init())
.pipe(babel())
.pipe(concat("bundle.min.js"))
.pipe(uglify())
.pipe(sourcemaps.write("."))
.pipe(gulp.dest("dist/lib/js"))
});
gulp.task("js:clean", function(cb){
del(["dist/lib/js"], cb);
});
Over all I think it's a lot easier to setup tasks and it's easier to see what the tasks are doing. Plus it's using es6 and es7 features which makes it read more like standard code rather than lib specific code