級聯和微小

Question

期間，不要再壓縮已經過壓縮文件，我有minifies CSS文件，並將它們連接到一個文件一飲而盡任務：

gulp.task('minify-css', function() { 
'use strict'; 
var pathsToMinifyAndConcat = [ 
    'css/index.css' 
]; 

var pathsToConcatOnly = [ 
    'lib/css/font-awesome-4.3.0/font-awesome.min.css' 
]; 

var minifyFiles = require('gulp-cssnano'); 
var concatAllFilesToOneFile = require('gulp-concat'); 
return gulp.src(
     [] 
      .concat(pathsToMinifyAndConcat) 
      .concat(pathsToConcatOnly) 
    ) 
    .pipe(minifyFiles()) 
    .pipe(concatAllFilesToOneFile('application.min.css')) 
    .pipe(gulp.dest('dist')); 
}); 

但是，如果某些文件已經過壓縮（如font-awesome.min.css例如） ，它不應該再縮小 - 它應該只是連接在一起，並且在縮小過程中應該省略它。有沒有辦法做到這一點沒有hacky解決方案（我不想使用我無法完全理解的解決方案 - 而且我很新的吞噬）保存文件的順序？我發現一個插件可以在管道中的任何點添加src文件：gulp-add-src，但它似乎暫時處於非活動狀態。

Answer 1

有多種方式做你想做的事。我會給你兩個例子。

第一：

var gulp = require('gulp'); 
var minify = require('gulp-cssnano'); 
var concat = require('gulp-concat'); 
var merge = require('merge-stream'); 

gulp.task('minify-css', function() { 

    var pathsToMinify = [ 
    'css/style1.css' 
    ]; 

    var pathsToConcat = [ 
    'css/style2.css' 
    ]; 

    var minStream = gulp.src(pathsToMinify) 
    .pipe(minify()); 

    var concatStream = gulp.src(pathsToConcat) 

    return merge(minStream, concatStream) 
    .pipe(concat('all.css')) 
    .pipe(gulp.dest('dist')); 

}); 

在本例中它被創建兩個不同的流。一個被縮小，另一個不是。最後，這兩個流合併，連接，然後將文件寫入磁盤。

第二：

var gulp = require('gulp'); 
var minify = require('gulp-cssnano'); 
var concat = require('gulp-concat'); 
var gulpFilter = require('gulp-filter'); 

gulp.task('minify-css', function() { 

    var paths = [ 
    'css/style1.css', 
    'css/style2.css' 
    ]; 

    // Files to minify. 
    var filter = gulpFilter([ 
    'style1.css' 
    ], 
    { 
    restore: true 
    }); 

    return gulp.src(paths) 
    .pipe(filter) 
    .pipe(minify()) 
    .pipe(filter.restore) 
    .pipe(concat('all.css')) 
    .pipe(gulp.dest('dist')); 

}); 

在該示例中，創建僅一個流，但乙烯基文件的目的是通過吞-過濾器過濾，只是將過濾的有精縮。然後，原來在管道中的所有文件都將使用filter.restore和串聯進行恢復。

還有其他的可能性，例如創建兩個不同的任務，其中一個只是簡化和另一個連接，但使用這種方法，您需要將縮小的文件臨時寫入磁盤。

Answer 2

與往常一樣晚到派對，但另一個選擇是使用gulp-if有條件地縮小文件。這樣的事情應該工作：

const gulp = require('gulp'), 
    gulpif = require('gulp-if'), 
    concat = require('gulp-concat'), 
    minifyCss = require('gulp-cssnano'); 

gulp.task('css', function() { 
    gulp.src([ 
    'css/index.css', 
    'lib/css/font-awesome-4.3.0/font-awesome.min.css' 
    ]) 
    .pipe(gulpif(file => !(file.path.includes('.min.css')), minifyCss())) 
    .pipe(concat('app.min.css')) 
    .pipe(gulp.dest('dist')); 
}); 

希望這有助於！