gulp 任务可以结合起来更快吗？答案

【问题标题】：gulp tasks could be combined to be faster?gulp 任务可以结合起来更快吗？
【发布时间】：2014-08-18 03:45:23
【问题描述】：

我有一个刚刚编写的 gulp 文件，我是新手。它正在工作，但我的任务比我认为需要的要多。

谁能帮我把javascript任务串成一个任务？

完成后我需要四个单独的 js 文件，所有这些文件都被丑化了。

来自gulpfile.js的相关代码sn-p：

    var gulp = require('gulp')
        uglify = require('gulp-uglify'),
        rename = require('gulp-rename'),
        concat = require('gulp-concat'),
        notify = require('gulp-notify'),
        cache = require('gulp-cache'),
        del = require('del');


    gulp.task('clean', function(cb) {
        del(['css/*', 'js/min/*'], cb)
    });

    gulp.task('featuretest', function() {
        return gulp.src('js/feature-test.js')
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify())
        .pipe(gulp.dest('js/min'))
    });

    // This file: '/js/excanvas.min.js' is only loaded via lte IE8 conditional statement
    gulp.task('excanvas', function() {
        return gulp.src('js/polyfills/excanvas.js')
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify())
        .pipe(gulp.dest('js/min'))
    });

    // This file: '/js/charts.min.js' is only used on very few pages
    gulp.task('charts', function() {
        return gulp.src(['js/highcharts-4.0.1.js', 'js/usfa-theme.js'])
        .pipe(concat('charts.js'))
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify())
        .pipe(gulp.dest('js/min'))
    });

    // This file: '/js/main.min.js' is a concat of 'libs/jquery', a few polyfills (except excanvas.js and the highcharts)
    gulp.task('scripts', function() {
        return gulp.src(['js/libs/*.js', 'js/plugins/*.js', 'js/polyfills/*.js', '!js/excanvas.js', '!js/highcharts-4.0.1.js', 'js/custom.js'])
        .pipe(concat('main.js'))
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify())
        .pipe(gulp.dest('js/min'))

        .pipe(notify({ message: 'Scripts task complete' }));
    });

    gulp.task('watch', function() {

      // Watch .js files
      gulp.watch('js/**/*.js', ['featuretest', 'excanvas', 'charts', 'scripts']);

    });



    gulp.task('default', ['clean'], function() {
        gulp.start('featuretest', 'excanvas', 'charts', 'scripts');
    });

我想做什么：

    var gulp = require('gulp')
        uglify = require('gulp-uglify'),
        rename = require('gulp-rename'),
        concat = require('gulp-concat'),
        notify = require('gulp-notify'),
        cache = require('gulp-cache'),
        del = require('del');


    gulp.task('clean', function(cb) {
        del(['css/*', 'js/min/*'], cb)
    });

    gulp.task('scripts', function() {
    // This file: '/js/feature-test.js' is loaded in the doc <head>
        return gulp.src('js/feature-test.js')
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify())
        .pipe(gulp.dest('js/min'))

    // This file: '/js/excanvas.min.js' is only loaded via lte IE8 conditional statement at the end of the doc    
        return gulp.src('js/polyfills/excanvas.js')
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify())
        .pipe(gulp.dest('js/min'))

    // This file: '/js/charts.min.js' is only used on very few pages and is loaded only when needed at the end of the doc
        return gulp.src(['js/highcharts-4.0.1.js', 'js/usfa-theme.js'])
        .pipe(concat('charts.js'))
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify())
        .pipe(gulp.dest('js/min'))

    // This file: '/js/main.min.js' is a concat of 'libs/jquery', a few polyfills (except excanvas.js and the high charts), it is loaded at the end of every doc

        return gulp.src(['js/libs/*.js', 'js/plugins/*.js', 'js/polyfills/*.js', '!js/excanvas.js', '!js/highcharts-4.0.1.js', 'js/custom.js'])
        .pipe(concat('main.js'))
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify())
        .pipe(gulp.dest('js/min'))

        .pipe(notify({ message: 'Scripts task complete' }));
    });

    gulp.task('watch', function() {

      // Watch .js files
      gulp.watch('js/**/*.js', ['scripts']);

    });



    gulp.task('default', ['clean'], function() {
        gulp.start('scripts');
    });

【问题讨论】：

您是否只寻找一项任务（uglify JavaScript 文件）？如果是这样，那么上面发布的scripts 任务就足够了。
我正在尝试结合以下任务，如果它可以使其更快... featuretest、excanvas、charts、scripts 注意：那里还有 concat 进行
但是我无法连接所有这些文件，完成后我需要 4 个单独的文件。
不要使用.pipe(concat('xxx.js'))。
@Aperçu：上面编辑的代码

标签： javascript task gulp gulp-concat gulp-uglify

【解决方案1】：

如果您要问的问题是如何将单独的操作合并到一个任务中，您可以将流与gulp-util 合并。

var gulp = require('gulp')
    uglify = require('gulp-uglify'),
    util = require('gulp-util');

gulp.task('scripts', function() {
    var featureTest = gulp.src('js/feature-test.js')...

    var excanvas = gulp.src('js/polyfills/excanvas.js')...

    var charts = gulp.src(['js/highcharts-4.0.1.js', 'js/usfa-theme.js'])...

    var scripts = gulp.src(['js/libs/*.js', 'js/plugins/*.js', 'js/polyfills/*.js', '!js/excanvas.js', '!js/highcharts-4.0.1.js', 'js/custom.js'])...

   // combine streams
   return util.combine(featureTest, excanvas, charts, scripts);
});

这将为您提供一个任务，但速度并不快。如果你不强迫事情是连续的，gulp 会尽可能快。

【讨论】：

谢谢，我想通了！