gulp插件(7) - gulp-concat(文件合并)

功能描述

合并文件，减少网络请求。

---

插件安装

$ cnpm install gulp-concat --save-dev

使用方法

例1：基本使用

var gulp   = require('gulp'),
    concat = require('gulp-concat'),
    pump   = require('pump');
 
gulp.task('testConcat', function (cb) {
    pump([
        gulp.src('src/js/*.js'),
        concat('all.js'),//合并后的文件名
        gulp.dest('dist/js');
    ], cb);
});

例2：与插件gulp-less(不会用？请参考)，gulp-clean-css(不会用？请参考)组合使用，实现将项目中的框架less整合成一个文件app.min.css

var gulp      = require('gulp'),
    concat    = require('gulp-concat'),
    less      = require('gulp-less'),
    minifyCss = require('gulp-clean-css'),
    rename    = require('gulp-rename'),
    pump      = require('pump');
 
gulp.task('testConcat', function (cb) {
    pump([
        gulp.src('src/less/app/*.less'),
        less(),                    // 编译
        concat('app.css'),         // 合并
        minifyCss(),               // 压缩
        rename({suffix: '.min'}),  // 更名
        gulp.dest('dist/js');
    ], cb);
});

例3： JS文件的压缩合并，可以作为练习题