我在使用Gulp时遇到了很多相同的问题,对于多个任务管道到多个目标似乎很困难或者潜在地不可能。此外,为一个任务设置多个流似乎效率低下,但我想这是目前的解决方案。
对于我的当前项目,我需要将多个捆绑包与各种页面相关联。修改Gulp Starter是我的解决方案。
https://github.com/greypants/gulp-starter
browserify/watchify任务:
https://github.com/dtothefp/gulp-assemble-browserify/blob/master/gulp/tasks/browserify.js
我在glob模块的回调函数中使用了forEach循环:
gulp.task('browserify', function() {
var bundleMethod = global.isWatching ? watchify : browserify;
var bundle = function(filePath, index) {
var splitPath = filePath.split('/');
var bundler = bundleMethod({
entries: [filePath],
extensions: ['.coffee', '.hbs', '.html'],
debug: true
});
if( index === 0 ) {
bundleLogger.start();
}
bundler
.transform(partialify)
.bundle()
.on('error', handleErrors)
.pipe(source( splitPath[splitPath.length - 1] ))
.pipe(gulp.dest('./build/js/pages'));
if( index === (files.length - 1) ) {
bundler.on('end', bundleLogger.end);
}
if(global.isWatching) {
bundler.on('update', function(changedFiles) {
changedFiles.forEach(function(filePath, index) {
bundle(filePath, index);
});
});
}
}
var files = glob('src/js/pages/*.js', function(err, files) {
files.forEach(function(file, index) {
bundle(process.cwd() + '/' + file, index);
})
});
});
var bundle = browserify('./src/index.js').bundle();
然后将其馈送到两个不同的“管道”中?例如bundle.pipe(source('bundle.js')).pipe(gulp.dest('./dist'));
和bundle.pipe(rename('bundle.min.js')).pipe(streamify(uglify()) .pipe(gulp.dest('./dist'));
这样,bundle只运行一次,我们就可以两次使用输出。 - AntouanK