如何在使用gulp-rev后将修改后的文件包含到.html中？

Question

所以我在gulp中创建了这个任务:

'use strict';
var gulp = require('gulp');
var gulpGlobals = require('./_gulp-globals.js');
var rev = require('gulp-rev');
var revReplace = require('gulp-rev-replace');


gulp.task('gulp-rev', function () {
    var sources = gulpGlobals.src + '/somefolder/**/*.js';
    var fileToInject = gulpGlobals.destination + '/somefolder/script.js';

    var outputFolderJs = 'webapp/dist/somefolder';

    return gulp.src(fileToInject)
        .pipe(rev())
        .pipe(revReplace())
        .pipe(gulp.dest(outputFolderJs));
});

并创建了另外一个名为this的文件,例如: script-7c58e79612.js

但是,如何将其包含在我的html文件中而不是script.js？所以前面的例子而不是我的这一行file.html:

<script type="text/javascript" src="{{ STATIC_URL}}/somefolder/script.js</script>

我可以这样:

<script type="text/javascript" src="{{ STATIC_URL}}/somefolder/script-7c58e79612.js</script>

Answer 1

您gulp-rev-replace在尝试时需要这样做,但是您需要在html文件而不是脚本文件中使用它.例如,尝试修改您的任务,如下所示:

var manifestFolder = 'webapp/dist/manifest';

gulp.task("gulp-rev", function(){
    var sources = gulpGlobals.src + '/somefolder/**/*.js';
    var fileToInject = gulpGlobals.destination + '/somefolder/script.js';
    var outputFolderJs = 'webapp/dist/somefolder';

    return gulp.src(fileToInject)
        .pipe(rev())
        .pipe(gulp.dest(outputFolderJs))
        .pipe(rev.manifest()
        .pipe(gulp.dest(manifestFolder));
})

gulp.task("revreplace", ["gulp-rev"], function() {
    var manifest = gulp.src("./" + manifestFolder + "/rev-manifest.json");
    var source = gulpGlobals.src + '/somefolder/file.html';
    var outputFolderHtml = 'webapp/dist/somefolder';

    return gulp.src(source)
        .pipe(revReplace({manifest: manifest}))
        .pipe(gulp.dest(outputFolderHtml));
});

该代码是基于所述的第二例使用文档的gulp-rev-replace.该页面上还有更多文档和示例.