javascript - 如何使用 gulp 替换文件中的字符串？

Question

我正在使用 gulp 来丑化并准备我的 javascript 文件以进行生产。我所拥有的是这段代码:

var concat = require('gulp-concat');
var del = require('del');
var gulp = require('gulp');
var gzip = require('gulp-gzip');
var less = require('gulp-less');
var minifyCSS = require('gulp-minify-css');
var uglify = require('gulp-uglify');

var js = {
    src: [
        // more files here
        'temp/js/app/appConfig.js',
        'temp/js/app/appConstant.js',
        // more files here
    ],

gulp.task('scripts', ['clean-js'], function () {
    return gulp.src(js.src).pipe(uglify())
      .pipe(concat('js.min.js'))
      .pipe(gulp.dest('content/bundles/'))
      .pipe(gzip(gzip_options))
      .pipe(gulp.dest('content/bundles/'));
});

我需要做的是替换字符串:

dataServer: "http://localhost:3048",

与

dataServer: "http://example.com",

在文件“temp/js/app/appConstant.js”中，

我正在寻找一些建议。例如，也许我应该复制 appConstant.js 文件，更改它(不确定如何)并将 appConstantEdited.js 包含在 js.src 中？

但我不确定 gulp 如何制作文件的副本并替换文件内的字符串。

如果您提供任何帮助，我们将不胜感激。

Answer 1

Gulp 流输入，执行所有转换，然后流输出。使用 Gulp 时，在两者之间保存临时文件据我所知是不惯用的。

相反，您正在寻找的是一种替换内容的流式传输方式。自己编写一些东西会比较容易，或者您可以使用现有的插件。对我来说， gulp-replace 效果很好。

如果您想在所有文件中进行替换，可以很容易地更改您的任务，如下所示:

var replace = require('gulp-replace');

gulp.task('scripts', ['clean-js'], function () {
    return gulp.src(js.src)
      .pipe(replace(/http:\/\/localhost:\d+/g, 'http://example.com'))
      .pipe(uglify())
      .pipe(concat('js.min.js'))
      .pipe(gulp.dest('content/bundles/'))
      .pipe(gzip(gzip_options))
      .pipe(gulp.dest('content/bundles/'));
});

你也可以这样做gulp.src仅在您期望模式所在的文件上，并通过 gulp-replace 单独流式传输它们，将其与 gulp.src 合并之后所有其他文件的流。