Gulp plugin for modifying CSS URLs
npm install --save-dev gulp-modify-css-urls
/* gulpfile.babel.js */
import gulp from 'gulp';
import modifyCssUrls from 'gulp-modify-css-urls';
/* style.css
body {
background-image: url('images/logo.png');
}
*/
gulp.task('modifyUrls', () =>
gulp.src('style.css')
.pipe(modifyCssUrls({
modify(url, filePath) {
return `app/${url}`;
},
prepend: 'https://fancycdn.com/',
append: '?cache-buster'
}))
.pipe(gulp.dest('./'))
);
/* style.css
body {
background-image: url('https://fancycdn.com/app/images/logo.png?cache-buster');
}
*/
/* gulpfile.js */
var gulp = require('gulp')
, modifyCssUrls = require('gulp-modify-css-urls');
/* style.css
body {
background-image: url('images/logo.png');
}
*/
gulp.task('modifyUrls', function () {
return gulp.src('style.css')
.pipe(modifyCssUrls({
modify: function (url, filePath) {
return 'app/' + url;
},
prepend: 'https://fancycdn.com/',
append: '?cache-buster'
}))
.pipe(gulp.dest('./'));
});
/* style.css
body {
background-image: url('https://fancycdn.com/app/images/logo.png?cache-buster');
}
*/
A function that is passed the current URL and file path and then returns the modified URL to replace the existent URL.
The modify function is always ran before append and prepend options.
A string that is appended to every URL.
A string that is prepended to every URL.
MIT