Gulp：在另一个任务中使用来自一个任务的输出 [英] Gulp: Use output from one task in another task
本文介绍了Gulp：在另一个任务中使用来自一个任务的输出的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有三个gulp任务，其中最后一个任务（ allScripts ）首先运行两个相关任务，然后从中加入所生成的文件。
在最后一项任务中，我可以从两个第一个任务中删除这两个结果文件，并且在加入文件之后快乐地生活。
但我在想，是否有可能通过将它们装入 allScripts 任务来避免这两个临时文件直接？
gulp.task（'firstGroup'，function（）{
return gulp.src（' （'some-scripts.js'））
.pipe（gulp.dest（'some / files / *。js'）
.pipe（doSomething（））
.pipe dest'））;
}）;
gulp.task（'secondGroup'，function（）{
return gulp.src（'some / other / files / *。js'）
.pipe（doSomethingElse ））
.pipe（concat（'some-other-scripts.js'））
.pipe（gulp.dest（'dest'））;
}）;
gulp.task（'allScripts'，['firstGroup'，'secondGroup']，function（）{
return gulp.src（['dest / some-scripts.js'， 'dest / some-other-scripts.js']）
.pipe（concat（'all-scripts.js'））
.pipe（gulp.dest（'dest'））
//删除两个src文件
}）;
解决方案
如果一切都可以是单个任务， gulp-merge 插件可将多个数据流合并为一个。如果任务需要保持独立，下面还有一个解决方案，但请注意，该方法是一种破解，因为它依赖于Gulp中的暴露财产。
没有hack解决方案，使用另一个任务中的输出，需要中间存储，就像你对文件所做的一样。
单一任务解决方案：
以下是一个使用 gulp-merge ：
var gulp = require（'gulp'）;
var gulpMerge = require（'gulp-merge'）;
var concat = require（'gulp-concat'）;
var replace = require（'gulp-replace'）;
gulp.task（'all-txt'，function（）{
return gulpMerge（
gulp.src（'file1.txt'）
.pipe替换（/ foo / g，'bar'）），
gulp.src（'file2.txt'）
.pipe（替换（/ baz / g，'qux'））
）
.pipe（concat（'all-text.txt'））
.pipe（gulp.dest（'dest'））;
}）;
在您的案例中，在您的问题中使用代码它看起来像：
var gulp = require（'gulp'）;
var gulpMerge = require（'gulp-merge'）;
var concat = require（'gulp-concat'）;
//你的插件
gulp.task（'allScripts'，function（）{
return gulpMerge（
gulp.src（'some / files （'some-scripts.js'）），
。 /*.js'）
.pipe（doSomethingElse（））
.pipe（concat（'some-other-scripts.js'））
）
.pipe（concat （'all-scripts.js'））
.pipe（gulp.dest（'dest'））;
}）;
多任务解决方案：
如果您的任务结构是这样的，您无法使用上述方法将它们合并为单个任务，这是您最好的选择。从某种意义上说，它依赖于 Gulp.tasks 这是一个非标准的暴露属性，这有点冒险。这个代码片段依赖于 event-stream 包，因为它更健壮，我在其中使用了一些实用工具 runTasksAndGetStreams 函数。
$ b
var gulp =要求（ '吞'）;
var concat = require（'gulp-concat'）;
var replace = require（'gulp-replace'）;
var es = require（'event-stream'）;
$ b gulp.task（'all-txt'，function（）{
return es.merge.apply（null，runTasksAndGetStreams（['file1-txt'，'file2 （'all-text.txt'））
.pipe（gulp.dest（'dest'））;
}）;
.pipe（concat（'all-text.txt'））
$ b gulp.task（'file1-txt'，['random-task-dep']，function（）{
return gulp.src（'file1.txt' ）
.pipe（替换（/ foo / g，'bar'））;
}）;
gulp.task（'file2-txt'，function（）{
return gulp.src（'file2.txt'）
.pipe（replace（/ baz / g ，'qux'））;
}）;
gulp.task（'random-task-dep'，function（）{
return gulp.src（'random-file.txt'）
.pipe（gulp。 dest（'dest'））;
}）;
//运行给定任务并返回它们的流
//这也将处理任何任务依赖关系
//
//这基本上是一个自定义的吞咽任务orchestartor。
//
//为此编写的问题：http://stackoverflow.com/q/28334314/796832
// Gist：https://gist.github.com/MadLittleMods / d4083d2ba35e2f850161
//
// Params：
// taskNames：字符串或任务名称字符串数组
// debugLog：*可选*布尔值，用于打印一些调试信息控制台
函数gulpRunTasksAndGetStreams（taskNames，/ *可选* / debugLog）{
//您可以传入一个任务或一组任务来完成
taskNames = [] .concat（ taskNames）;
//我们填充了我们使用的`gulp-util`部分，以防某些人想要使用它而不安装`gulp-util`
var gutil;
尝试{
gutil = require（'gulp-util'）;
}
catch（err）{
gutil = {
log：console.log，
colors：{
cyan：function（str）{
return str;
}，
magenta：function（str）{
return str;
}
}
};
}
var resultsTaskInfo = [];
var taskMap = gulp.tasks;
//满足所有的任务依赖关系，创建一个占位符流，并收集func
//以使得真正的流在稍后完成依赖时提供。mergedDepStream.on （'end'）`
var mergedDepStream = null;
taskNames.forEach（function（taskName）{
var task = taskMap [taskName];
if（debugLog）{
gutil.log（'root task： '，gutil.colors.cyan（taskName），'started working'）;
}
//首先运行任何依赖项
var depStreamResult = runDependenciesRecursivelyForTask（taskName，taskMap）;
if（depStreamResult）{
mergedDepStream = mergedDepStream？es.merge（mergedDepStream，depStreamResult）：depStreamResult;
}
if（debugLog）{
if（depStreamResult）{
depStreamResult.on（'end'，function（）{
gutil.log（'root task：'，gutil.colors.cyan（taskName）''deps完成'）;
}）;
}
else {
gutil.log（'root task：'，gutil.colors.cyan（taskName），'no deps present' ）;
}
}
//然后将任务本身推送到列表
句子结果TASKINFO.push（{
stream：es.through（），
fn：task.fn
}）;
}）;
//一旦所有依赖完成
mergedDepStream.on（'end'，function（）{
if（debugLog）{
gutil.log（'所有依赖完成，管道在真正的根任务'）;
}
//将实际任务传送到占位符
句柄resultTaskInfo.forEach（function（taskInfo ）{
var actualTaskStream = taskInfo.fn（）;
actualTaskStream.pipe（taskInfo.stream）;
}）;
}）;
//以递归方式获取任务的所有依赖关系
函数runDependenciesRecursivelyForTask（taskName，taskMap，mergedDependencyStream）{
var task = taskMap [taskName];
task.dep.forEach（function（depTaskName）{
var depTask = taskMap [depTaskName];
if（debugLog）{
gutil.log（'dep任务：'，gutil.colors.cyan（depTaskName），'开始工作'）;
}
//依赖可以有依赖关系
var recursiveStreamResult = null; $ b $如果（depTask.dep.length）{
recursiveStreamResult = runDependenciesRecursivelyForTask（depTaskName，taskMap，mergedDependencyStream）;
mergedDependencyStream = mergedDependencyStreames.merge（mergedDependencyStream，recursiveStreamResult）：recursiveStreamResult;
}
if（depTask.fn）{
var whenStreamHandledCallback = function（/ *我们只使用`noDeps`来记录* / noDeps）{
if（debugLog）{
如果（！noDeps）{
gutil.log（'de p任务：'，gutil.colors.cyan（depTask.name），'deps done'）;
}
else {
gutil.log（'dep task：'，gutil.colors.cyan（depTask.name），'no deps present'）;
}
}
var depTaskStream = depTask.fn（）;
//在整体依赖进度流中合并它
mergedDependencyStream = mergedDependencyStream？ es.merge（mergedDependencyStream，depTaskStream）：depTaskStream;
};
if（recursiveStreamResult === null）{
whenStreamHandledCallback（true）;
}
else {
recursiveStreamResult.on（'end'，whenStreamHandledCallback）;
}
}
}）;
返回mergedDependencyStream;
//返回（placeholder）流，一旦依赖关系完成，将获得实际流的管道
返回句号resultTaskInfo.map（function（taskInfo） {
return taskInfo.stream;
}）;
}
I have have three gulp tasks, where the last task (allScripts) runs the two dependent tasks first and then joins the resultant files from them.
I could, in the last task, delete the two result-files from the two first tasks and live happily ever after with the joined file.
But I was thinking, is it possible to avoid the two temporary files by somehow piping them into the allScripts task "directly"?
gulp.task('firstGroup', function() {
return gulp.src('some/files/*.js')
.pipe(doSomething())
.pipe(concat('some-scripts.js'))
.pipe(gulp.dest('dest'));
});
gulp.task('secondGroup', function() {
return gulp.src('some/other/files/*.js')
.pipe(doSomethingElse())
.pipe(concat('some-other-scripts.js'))
.pipe(gulp.dest('dest'));
});
gulp.task('allScripts', ['firstGroup','secondGroup'], function() {
return gulp.src(['dest/some-scripts.js','dest/some-other-scripts.js'])
.pipe(concat('all-scripts.js'))
.pipe(gulp.dest('dest'))
// delete the two src-files
});
解决方案
If everything can be a single task, you can use the gulp-merge plugin to combine multiple streams into one. There is also a solution below if the tasks need to stay separate, but please note that that method is a hack because it relies on a exposed property in Gulp.
Without a hack solution, using the output from one task in another, would require intermediary storage, like what you are doing with a file.
Single task solution:
Here is a barebones demo using gulp-merge:
var gulp = require('gulp');
var gulpMerge = require('gulp-merge');
var concat = require('gulp-concat');
var replace = require('gulp-replace');
gulp.task('all-txt', function() {
return gulpMerge(
gulp.src('file1.txt')
.pipe(replace(/foo/g, 'bar')),
gulp.src('file2.txt')
.pipe(replace(/baz/g, 'qux'))
)
.pipe(concat('all-text.txt'))
.pipe(gulp.dest('dest'));
});
In your case and using the code in your question it would look like:
var gulp = require('gulp');
var gulpMerge = require('gulp-merge');
var concat = require('gulp-concat');
// ... your plugins
gulp.task('allScripts', function() {
return gulpMerge(
gulp.src('some/files/*.js')
.pipe(doSomething())
.pipe(concat('some-scripts.js')),
gulp.src('some/other/files/*.js')
.pipe(doSomethingElse())
.pipe(concat('some-other-scripts.js'))
)
.pipe(concat('all-scripts.js'))
.pipe(gulp.dest('dest'));
});
Multiple task solution:
If your task structure is such that you can not merge them into a single task using the method above, this is your best bet. It is a bit hacky in the sense that it relies on Gulp.tasks which is a non-standard exposed property. There is no gurantee that this will work with future versions of Gulp (currently tested with Gulp v3.8.10).
This snippet relies on the event-stream package because it is more robust and I use some of their utilities in the runTasksAndGetStreams function.
var gulp = require('gulp');
var concat = require('gulp-concat');
var replace = require('gulp-replace');
var es = require('event-stream');
gulp.task('all-txt', function() {
return es.merge.apply(null, runTasksAndGetStreams(['file1-txt', 'file2-txt']))
.pipe(concat('all-text.txt'))
.pipe(gulp.dest('dest'));
});
gulp.task('file1-txt', ['random-task-dep'], function() {
return gulp.src('file1.txt')
.pipe(replace(/foo/g, 'bar'));
});
gulp.task('file2-txt', function() {
return gulp.src('file2.txt')
.pipe(replace(/baz/g, 'qux'));
});
gulp.task('random-task-dep', function() {
return gulp.src('random-file.txt')
.pipe(gulp.dest('dest'));
});
// Run the given tasks and returns their streams
// This will also take care of any task dependencies
//
// This is basically a custom gulp task orchestartor.
//
// Written for this SO question: http://stackoverflow.com/q/28334314/796832
// Gist: https://gist.github.com/MadLittleMods/d4083d2ba35e2f850161
//
// Params:
// taskNames: string or array of strings of task names
// debugLog: *optional* boolean to print some debug information to the console
function gulpRunTasksAndGetStreams(taskNames, /*optional*/debugLog) {
// You can pass in a single task or an array of tasks to complete
taskNames = [].concat(taskNames);
// We polyfill the pieces of `gulp-util` that we use in case some one wants to use it without installing `gulp-util`
var gutil;
try {
gutil = require('gulp-util');
}
catch(err) {
gutil = {
log: console.log,
colors: {
cyan: function(str) {
return str;
},
magenta: function(str) {
return str;
}
}
};
}
var resultantTaskInfo = [];
var taskMap = gulp.tasks;
// Satisfy all of the task dependencies, create a placeholder stream, and collect the func
// to make the real stream to feed in later when the dependencies are done `mergedDepStream.on('end')`
var mergedDepStream = null;
taskNames.forEach(function(taskName) {
var task = taskMap[taskName];
if(debugLog) {
gutil.log('root task:', gutil.colors.cyan(taskName), 'started working');
}
// Run any dependencies first
var depStreamResult = runDependenciesRecursivelyForTask(taskName, taskMap);
if(depStreamResult) {
mergedDepStream = mergedDepStream ? es.merge(mergedDepStream, depStreamResult) : depStreamResult;
}
if(debugLog) {
if(depStreamResult) {
depStreamResult.on('end', function() {
gutil.log('root task:', gutil.colors.cyan(taskName), 'deps done');
});
}
else {
gutil.log('root task:', gutil.colors.cyan(taskName), 'no deps present');
}
}
// Then push the task itself onto the list
resultantTaskInfo.push({
stream: es.through(),
fn: task.fn
});
});
// Once all of the dependencies have completed
mergedDepStream.on('end', function() {
if(debugLog) {
gutil.log('All dependencies done, piping in real root tasks');
}
// Pipe the actual task into our placeholder
resultantTaskInfo.forEach(function(taskInfo) {
var actualTaskStream = taskInfo.fn();
actualTaskStream.pipe(taskInfo.stream);
});
});
// Recursively gets all of dependencies for a task in order
function runDependenciesRecursivelyForTask(taskName, taskMap, mergedDependencyStream) {
var task = taskMap[taskName];
task.dep.forEach(function(depTaskName) {
var depTask = taskMap[depTaskName];
if(debugLog) {
gutil.log('dep task:', gutil.colors.cyan(depTaskName), 'started working');
}
// Dependencies can have dependencies
var recursiveStreamResult = null;
if(depTask.dep.length) {
recursiveStreamResult = runDependenciesRecursivelyForTask(depTaskName, taskMap, mergedDependencyStream);
mergedDependencyStream = mergedDependencyStream ? es.merge(mergedDependencyStream, recursiveStreamResult) : recursiveStreamResult;
}
if(depTask.fn) {
var whenStreamHandledCallback = function(/* we only use `noDeps` for logging */noDeps) {
if(debugLog) {
if(!noDeps) {
gutil.log('dep task:', gutil.colors.cyan(depTask.name), 'deps done');
}
else {
gutil.log('dep task:', gutil.colors.cyan(depTask.name), 'no deps present');
}
}
var depTaskStream = depTask.fn();
// Merge it in overall dependency progress stream
mergedDependencyStream = mergedDependencyStream ? es.merge(mergedDependencyStream, depTaskStream) : depTaskStream;
};
if(recursiveStreamResult === null) {
whenStreamHandledCallback(true);
}
else {
recursiveStreamResult.on('end', whenStreamHandledCallback);
}
}
});
return mergedDependencyStream;
}
// Return the (placeholder) streams which will get piped the real stream once the dependencies are done
return resultantTaskInfo.map(function(taskInfo) {
return taskInfo.stream;
});
}
这篇关于Gulp：在另一个任务中使用来自一个任务的输出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
