如何使用 gulp 重命名 index.html 中脚本的原始文件？

Question

我编写了一个 gulp 任务来重命名文件，以便对它们进行版本控制。问题是index.html 脚本引用的文件的文件名没有改变。

例如在我的index.html:

<script src=pub/main_v1.js"></script>

但如果你真的通过构建文件夹导航到子目录pub，你会发现main.js。

这是自定义的 gulp 任务：

const gulpConcat = require('gulp-concat');
const gulpReplace = require('gulp-replace');
const version = require('./package.json').version;

gulp.task('version', function () {
    var vsn = '_' + version + '.js';
    gulp.src('scripts/**/*.js')
        .pipe(gulpConcat(vsn))
        .pipe(gulp.dest('./prodBuild'));

    return gulp.src('./prodBuild/index.html', { base: './prodBuild' })
        .pipe(gulpReplace(/* some regex */, /* append vsn */))
        .pipe(gulp.dest('./prodBuild'));
});

我需要修复/添加什么以使原始文件名更改以匹配脚本标记中的内容？

注意：根据 gulp-concat docs，我应该能够在prodBuild/[vsn] 找到连接文件，其中[vsn] 是_v1.js。但是，它在哪里找不到。

更新：文件在index.html 中正确重命名，但我似乎无法重命名原始文件。这是我的构建目录的快照：

prodBuild/
 pub/
   main.js
 someDir/
   subDirA/
     // unimportant stuff
   subDirB/
     file2.js
   file3.js
 // ...other files and folders...

Answer 1

编辑： 问题是您只返回两个任务之一。 gulp 简单地忽略了第一个任务，因为它没有返回。一个简单的解决方案：将其拆分为两个任务，并在另一个任务中引用一个，例如 this SO answer。

旧答案

这看起来是gulp-rename 的完美案例。您可以通过gulp-rename 简单地通过管道传输您的脚本，如下所示：

.pipe(rename(function (path) {
    path.basename += vsn;
    path.extname = ".js"
  }))

Gulp concat，AFAIK，用于文件的连接，而不是专门用于重命名它们。