gulp-rev-replace-relative v0.5.8
gulp-rev-replace
A copy of gulp-rev-replace, add relative path replacement support.
add options.base
for relative path caculation.
add options.suffix
add options.noRev
to replace relative path to absolute path without adding rev
add options.relative
not to change path to absolute
Install
$ npm install --save-dev gulp-rev-replace-relative
Usage
Pipe through a stream which has both the files you want to be updated, as well as the files which have been renamed.
For example, we can use gulp-useref to concatenate assets in an index.html, and then use gulp-rev and gulp-rev-replace to cache-bust them.
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');
gulp.task("index", function() {
var jsFilter = filter("**/*.js", { restore: true });
var cssFilter = filter("**/*.css", { restore: true });
var indexHtmlFilter = filter(['**/*', '!**/index.html'], { restore: true });
return gulp.src("src/index.html")
.pipe(useref()) // Concatenate with gulp-useref
.pipe(jsFilter)
.pipe(uglify()) // Minify any javascript sources
.pipe(jsFilter.restore)
.pipe(cssFilter)
.pipe(csso()) // Minify any CSS sources
.pipe(cssFilter.restore)
.pipe(indexHtmlFilter)
.pipe(rev()) // Rename the concatenated files (but not index.html)
.pipe(indexHtmlFilter.restore)
.pipe(revReplace()) // Substitute in new filenames
.pipe(gulp.dest('public'));
});
It is also possible to use gulp-rev-replace without gulp-useref:
var rev = require("gulp-rev");
var revReplace = require("gulp-rev-replace");
gulp.task("revision", ["dist:css", "dist:js"], function(){
return gulp.src(["dist/**/*.css", "dist/**/*.js"])
.pipe(rev())
.pipe(gulp.dest(opt.distFolder))
.pipe(rev.manifest())
.pipe(gulp.dest(opt.distFolder))
})
gulp.task("revreplace", ["revision"], function(){
var manifest = gulp.src("./" + opt.distFolder + "/rev-manifest.json");
return gulp.src(opt.srcFolder + "/index.html")
.pipe(revReplace({manifest: manifest}))
.pipe(gulp.dest(opt.distFolder));
});
API
revReplace(options)
options.canonicalUris
Type: boolean
Default: true
Use canonical Uris when replacing filePaths, i.e. when working with filepaths
with non forward slash (/
) path separators we replace them with forward slash.
options.replaceInExtensions
Type: Array
Default: ['.js', '.css', '.html', '.hbs']
Only substitute in new filenames in files of these types.
options.prefix
Type: string
Default:
Add the prefix string to each replacement.
options.manifest
Type: Stream
(e.g., gulp.src()
)
Read JSON manifests written out by rev
. Allows replacing filenames that were
rev
ed prior to the current task.
options.modifyUnreved, options.modifyReved
Type: Function
Modify the name of the unreved/reved files before using them. The filename is passed to the function as the first argument.
For example, if in your manifest you have:
{"js/app.js.map": "js/app-98adc164.js.map"}
If you wanted to get rid of the js/
path just for .map
files (because they
are sourcemaps and the references to them are relative, not absolute) you could
do the following:
function replaceJsIfMap(filename) {
if (filename.indexOf('.map') > -1) {
return filename.replace('js/', '');
}
return filename;
}
return gulp.src(opt.distFolder + '**/*.js')
.pipe(revReplace({
manifest: manifest,
modifyUnreved: replaceJsIfMap,
modifyReved: replaceJsIfMap
}))
.pipe(gulp.dest(opt.distFolder));
Contributors
- Chad Jablonski
- Denis Parchenko
- Evgeniy Vasilev
- George Song
- Håkon K. Eide
- Juan Lasheras
- Majid Burney
- Simon Ihmig
- Vincent Voyer
- Bradley Abrahams