gulp-relate
Advanced tools
##Install
$ npm install --save-dev gulp-relate
Rewrite file references relative to the current file in the stream. Pass gulp-relate an object containing containing a handle used in the source and the path it should rewrite to.
src/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<link href="assets//css/styles.css">
</head>
<body>
<p>Oh. My. Glob.</p>
</body>
</html>
gulpfile.js
var gulp = require('gulp');
var relate = require('gulp-relate');
gulp.task('page', function() {
return gulp.src('./src/*.html')
.pipe(gulp.dest('./app/'))
.pipe(relate({assets: './app/assets/'}))
.pipe(gulp.dest('./app/'))
});
This comes in hand especially well with stream-based template systems, where assets are referenced in layouts and partials agnostic to any specific rendered file. For example, gulp-relate was conceived with this issue in mind from working with Nunjucks.
var gulp = require('gulp');
var data = require('gulp-data');
var fm = require('front-matter');
var render = require('gulp-nunjucks-render');
gulp.task('render', function() {
return gulp.src('./src/*.html')
.pipe(data(function(file){
var content = fm(String(file.contents));
file.contents = new Buffer(content.body);
return content.attributes;
}))
.pipe(render())
.pipe(gulp.dest('./app/'))
.pipe(relate({
assets: './app/assets/'
}))
.pipe(gulp.dest('./app/'))
});
FAQs
A gulp plugin to rewrite asset urls relative to a specified path.
We found that gulp-relate demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
An advanced npm supply chain attack is leveraging Ethereum smart contracts for decentralized, persistent malware control, evading traditional defenses.
Security News
Research
Attackers are impersonating Sindre Sorhus on npm with a fake 'chalk-node' package containing a malicious backdoor to compromise developers' projects.
Security News
The npm package for the LottieFiles Player web component was hit with a supply chain attack after a software engineer's npmjs credentials were compromised.