Question

我有一个名为build的gulp任务，它使用子任务将我的源的各个部分移动到构建文件夹：

gulp.task('build', ['jshint', 'templates', 'app', 'components', 'stylesheets', 'assets', 'index']);

gulp.task('app', ['clean-app'], function(){
    return gulp.src(config.inputs.app)
        .pipe(gulp.dest(config.outputs.root));
});

然后我想在--env = prod时添加一些额外的步骤，我用gulp-if做了：

gulp.task('app', ['clean-app'], function(){
    return gulp.src(config.inputs.app)
        **.pipe(gulpif(env === 'prod', uglify()))**
        .pipe(gulp.dest(config.outputs.root));
});

这很好用。我想做的最后一件事就是从这些子任务中吞下所有js文件。我想我可以使用gulpif从每个任务返回一个流而不是去gulp.dest，但我仍然需要以某种方式有条件地运行任务来组合这些流和concat。

有更好的方法吗？

Answer 1

为什么不为compile或build-prod分别执行任务，而不是将所有内容都推送到一个构建任务中。这将使您的代码更易于维护，并且不那么脆弱。

您仍然可以通过将这些任务封装在函数中来重用部分任务：

function jsBaseTasks() {
    return gulp.src(config.inputs.app);
}

gulp.task('build', function() { jsBaseTasks().pipe(...); // etc }

或者，如果您有可重复使用的代码块，可以使用lazypipe构建它们并根据需要使用它们：

var jsProcess = lazypipe()
                    .pipe(jshint, jshintOptions)
                    .pipe(/* other gulp plugin */);

gulp.task('build', function() { gulp.src(...).pipe(jsProcess()).pipe(gulp.dest()); }

此外，我认为将您的生产和开发构建构建到同一位置是一个坏主意。您将在某个时刻意外部署开发构建。

我有rather big gulpfile that does this，如果这有助于了解我的意思，但听起来你已经有很多工作了。

Answer 2

绝对希望将您的任务分成尽可能多的小模块，然后尽可能遵守DRY原则。

在你的情况下。例如，您可能只有一个标准dev任务可以启动并运行，并且可能会在您开发时运行一些watch任务和通用build任务。如果要为发行版部署代码，可能需要某种选项配置来定义要推送的文件。除此之外，您还可能有一个release任务查看配置文件，然后收集您需要的所有源，进程，连接，uglifies等，然后输出到指定的构建目标。 / p>

旁注：现在使用最新版本的gulp-watch更容易遵守DRY原则，因为您现在可以将数组作为回调函数传递。

我有一些gulpfiles，如果你需要帮助，我很乐意与你分享。

有条件的gulp连接多个任务

2 个答案: