0

I am minifying an index.html file with gulp (note: took over this project, build system has been done by former dev).

It all works fine, but the gulp task generates a HTML file which has a cryptic extension to it, like:

index-bd2c7f58f0.html

I understand this must have it's advantage, but I can't grasp what...:) Because the disadvantage now is:

  • The node server needs the presence of an index.html file to allow the '/' route to work.
  • Thus so far, I either have to copy the file on every build or create a link which needs to be updated on every build

What am I missing? Should I just instruct gulp to create a plain index.html file, or what are best practices here?

Also, which of the various plugin calls is actually responsible for attaching that extension to the file name?

EDIT: Seems to be the gulp-rev and revReplace calls

Here is the gulp task I am using:

gulp.task('html', ['styles', 'scripts'], function () {
    var client = buildHTML('./client/index.html', './dist/public');        
    return merge(client);
});

function buildHTML(index, distFolder) {
    var lazypipe = require('lazypipe');
    var saveHTML = lazypipe()
        .pipe($.htmlmin, {
            removeComments: true,
            removeOptionalTags: true
        })
        .pipe(gulp.dest, distFolder);


    return gulp.src(index)
        .pipe($.useref())
        .pipe($.rev())
        .pipe($.revReplace({replaceInExtensions: ['.js', '.css', '.html', '.ejs']}))
        .pipe($.if('*.html', saveHTML()));
}
transient_loop
  • 5,984
  • 15
  • 58
  • 117

1 Answers1

0

One advantage that I'm familiar with is when it's used with assets, when you recompile the asset and create a new fingerprint for that file, the request won't return the cached response because it's a different file. As for your problem, you probably shouldn't be adding that has to your index, I think it's pretty unorthodox

Jay
  • 998
  • 1
  • 10
  • 22