I have two gulp tasks
gulp.task('build:dev', ['task1', task2', task3'], () => {
doCssmin({'destination': ['file1', 'file2']});
});
gulp.task('build:prod', ['task1', task2', task3'], () => {
doCssmin({'destination': ['file3', 'file4']});
});
Now I have cssMin
task which is shared between build:dev
and build:prod
so I created that as a function to share with both of them.
function doCssmin(files) {
_.each(files, function(val, key) {
gulp.src(val)
.pipe(minifyCss({compatibility: 'ie8'}))
.pipe(rename(basename(key)))
.pipe(gulp.dest(dirname(key)));
});
}
and doCssmin
accept files
parameter as build:dev
and build:prod
they have different files to minify css. If I run build:dev
or build:prod
doCssmin
will be run asynchronously. But doCssmin
depends on task2
.
My question is how do I extract doCssmin
to a gulp task and accept files
parameter so it can be shared with build:dev
and build:prod
tasks?
Not sure if it's too confusing?
Yesterday, I answered a question on making your Gulp tasks more DRY . I believe a good chunk of that answer applies here as well.
To support loops with that, you want to merge the streams that you receive from gulp.src
. Using the example here :
gulp.task('test', function() {
var bootstrap = gulp.src('bootstrap/js/*.js')
.pipe(gulp.dest('public/bootstrap'));
var jquery = gulp.src('jquery.cookie/jquery.cookie.js')
.pipe(gulp.dest('public/jquery'));
return merge(bootstrap, jquery);
});
For an array, you can use Array.prototype.map
to convert the items into streams, then merge all of those:
function minifyCss(paths) {
return merge.apply(this, paths.map(function (path) {
gulp.src(path)
.pipe(minifyCss({compatibility: 'ie8'}))
.pipe(rename(basename(path)))
.pipe(gulp.dest(dirname(path)));
}));
}
gulp.task('test', function () {
return minifyCss(['foo', 'bar']);
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.