Q:

Is there a way I can use gulp to modify my index.thml to prevent CSS caching?

I have this gulpfile.js code:
gulp.task('make_prod_index', function () {
    gulp.src('index.html')
      .pipe(replace('content/bundles/css.min.css', 'content/bundles/css.min.css&12345'))
      .pipe(rename("index-prod.html"))
      .pipe(gulp.dest('./'));
});

What I was thinking of was if I could get the gulpfile to add in & followed by some number that's different every time I publish. 
Would this be a way to ensure the css is not cached and if so how could I ensure a different number is added each time I publish?

A:

You could get the md5 hash of the file and append that to the file pretty easily, like this:
...
var md5File = require('md5-file')

gulp.task('make_prod_index', function () {
    gulp.src('index.html')
      .pipe(replace('content/bundles/css.min.css', 'content/bundles/css.min.css?' +  md5File('content/bundles/css.min.css')))
      .pipe(rename("index-prod.html"))
      .pipe(gulp.dest('./'));
});

However it's better to change the file name for most caches, to avoid appending a query string. Some caches will see files with query strings as dynamic files and won't cache them.
It can be done with the gulp-rev task, for more information check the docs. It might be a bit more work depending on your solution. But from what I see you could go with something simple as gulp-rev-replace.

