Question

我正在使用gulp来缩小和连接我的js。目前这是我的gulpfile：

var gulp = require('gulp'),
    gp_concat = require('gulp-concat'),
    gp_uglify = require('gulp-uglify'),

gulp.task('js-concat-and-minify', function() {
    return gulp.src([
        './public/assets/bower_components/jquery/dist/jquery.js',
        './public/assets/bower_components/bootstrap/dist/js/bootstrap.js',
        './public/assets/bower_components/angular/angular.js',
        './public/assets/bower_components/angular-route/angular-route.js',
        './public/assets/bower_components/angular-cookies/angular-cookies.js',
    './public/app/**/*.js'
    ])
    .pipe(gp_concat('bundle.min.js'))
    .pipe(gulp.dest('./public/'))
    .pipe(gp_uglify())
    .pipe(gulp.dest('./public/'))
});

// default task...

事情就是这样：每个angular / jquery / bootstrap文件都有一个缩小版本，所以我不想每次都缩小它们。我想采用angular / jquery / bootstrap的缩小版本，将它们连接到一个文件，然后缩小我自己的位于'./public/app/**/*.js'下的js文件并将它们连接到同一个文件上面有我的库的文件。我该怎么做？

感谢。

Answer 1

您可以将任务分为三个任务。第一个任务将捆绑所有缩小的供应商文件，然后将结果放在临时文件夹中。第二个任务是捆绑和缩小你没有缩小文件。然后在你的第三个任务（你调用的那个）中对前两个任务进行依赖并捆绑结果。

gulp.task('bundleVendors', function() {
    return gulp.src([*your already minified files*])
    .pipe(gp_concat('bundle.min.js'))
    .pipe(gulp.dest('./temp/'));
}

gulp.task('bundleAndMinifyAppJs', function() {
    return gulp.src([*your not minified files*])
    .pipe(gp_concat('app.min.js'))
    .pipe(gp_uglify())
    .pipe(gulp.dest('./temp/'));
});

gulp.task('js-concat-and-minify', ['bundleVendors', 'bundleAndMinifyAppJs'], function() {
    return gulp.src(['./temp/app.min.js', './temp/bundle.min.js'])
    .pipe(gp_concat('bundle.min.js'))
    .pipe(gulp.dest('./public/'));
});

gulp - 连接到现有文件

1 个答案: