similar question here: how replace filenames listed in index.html output of gulp-rev?
im using gulp-useref combine files listed in build blocks. use gulp-rev add hash end of concatenated file , update markup new filename.
as per gulp-rev-replace doc, im using minor tweaks:
var gulp = require('gulp'); var rev = require('gulp-rev'); var revreplace = require('gulp-rev-replace'); var useref = require('gulp-useref'); var filter = require('gulp-filter'); var uglify = require('gulp-uglify'); var csso = require('gulp-csso'); var revall = require('gulp-rev-all'); gulp.task("index", function () { var jsfilter = filter("js/**/*.js"); var cssfilter = filter("css/**/*.css"); var revall = new revall(); var userefassets = useref.assets(); return gulp.src("views/**/*.cshtml") .pipe(userefassets) // concatenate gulp-useref .pipe(jsfilter) .pipe(uglify()) // minify javascript sources .pipe(jsfilter.restore()) .pipe(cssfilter) .pipe(csso()) // minify css sources .pipe(cssfilter.restore()) .pipe(rev()) // rename concatenated files .pipe(userefassets.restore()) .pipe(useref()) .pipe(revreplace()) // substitute in new filenames .pipe(gulp.dest('public')); }); my html looks so:
<!-- build:css css/combined.css --> <link href="css/components/style1.css" rel="stylesheet"> <link href="css/components/style2.css" rel="stylesheet"> <link href="css/pages/style3.css" rel="stylesheet"> <!-- endbuild --> <!-- build:js js/lib.js --> <script type="text/javascript" src="js/global/js1.js"></script> <script type="text/javascript" src="js/vendor/moment.js"></script> <script type="text/javascript" src="js/components/component.calendar.js"></script> <script type="text/javascript" src="js/pages/jaunt-hotels/matrix.js"></script> <!-- endbuild --> the output is:
<link rel="stylesheet" href="css/combined.css"> <script src="js/lib.js"> </script> but im looking like:
<link rel="stylesheet" href="css/combined-abc234.css"> <script src="js/lib-tyu765.js"></script> directory structure:
root |-css |-style1.css |-style2.css |-style3.css |-js |-*js files here |-views |-*many folders .cshtml files |-gulp |-tasks |-bundle-assets.js <- task contains code above any appreciated!
thanks updating question! tried gulp-setup yesterday , found out, useref , rev plugin's won't work if path assets incorrect. in sample, *.cshtml files in folder views, pointing ressources on 1 level above. going file inside views (like views/index.cshtml, path css/components/style1.css cannot resolved, because should ../css/components/style1.css. therefore useref gets empty resultset, not create files, , rev cannot update because has no point reference to.
get paths in cshtml right they're relative real ressources, work. hope can because setup looks little dotnetty, , i'm not sure if have freedom there change things ;-)
