Question

如何在源文件被串联的同时实现替换特定源文件上的字符串。

var gulp    = require('gulp'),
rename  = require('gulp-rename'),
concat  = require('gulp-concat'),
uglify  = require('gulp-uglify'),
replace = require('gulp-replace');
var config = {
    cssConcatFiles: [
       'one.css',
       'two.css',
       'three.css'
    ]   
 };

 gulp.task('css-concat', function() {
     return gulp.src(config.cssConcatFiles)
         .pipe(replace('url\(\'', 'url\(\'../images/fancybox/'))
         // I want to perform this replace to a particular file which is "two.css"

         .pipe(concat('temp.css'))
         .pipe(uglyfycss())
         .pipe(rename('temp.min.css'))
         .on('error', errorLog)
         .pipe(gulp.dest('public/css/plugins/fancybox'));
 });

Answer 1

这应该有效。 gulp-if

const gulpIF = require('gulp-if');


gulp.task('css-concat', function() {
 return gulp.src(config.cssConcatFiles)

     //.pipe(replace('url\(\'', 'url\(\'../images/fancybox/'))
     // I want to perform this replace to a particular file which is "two.css"

     .pipe(gulpIF((file) => file.path.match('two.css') , replace('url\(\'', 'url\(\'../images/fancybox/')))

     .pipe(concat('temp.css'))
     .pipe(uglyfycss())
     .pipe(rename('temp.min.css'))
     .on('error', errorLog)
     .pipe(gulp.dest('public/css/plugins/fancybox'));
});

您可以使用以下管道代替gulp-if调用：

.pipe(replace(/url\(\'/g, function(match) {
      if (this.file.relative === "two.css") {
        return 'url\(\'../images/fancybox/';
      }
      else return match;
}))

因为gulp-replace将函数作为参数，并为该函数提供乙烯基文件引用（this.file），您可以使用该文件参考来测试哪个文件正通过流。但是，即使您什么都不想要，也必须从函数调用中返回某些内容-因此请返回原始匹配项。

我建议您使用gulp-if，这对您而言更清洁。

如何使用gulp使用配置对象替换特定源文件中的字符串？

1 个答案: