gulp-html-transform
v2.3.2
Published
[![NPM version][npm]][npm-url] [![Node version][node]][node-url] [![Dependency status][deps]][deps-url]
Downloads
38
Readme
gulp-html-transform
Transforms some html using transformer functions
Installing
$ yarn add gulp-html-transformPlugins
insertFA: transforms<fa-icon>into Font Awesome icons.insertGA: Inserts google analytics into<head>.lqip: Replaces images with low quality image placeholders. WARNING: Adds html, so may mess with your css selectors or other things.minifyInlineJson: Minifies inline JSON.htmlSrcset: Expandssrcsetin your<img>.
Usage
gulpfile.js
const { transform, htmlSrcset, lqip } = require('gulp-html-transform')
gulp.task('html', () => {
gulp
.src('src/**/*.html')
.pipe(
transform(
htmlSrcset({
width: [1, 720],
format: ['webp', 'jpg'],
}),
lqip({
base: __dirname,
}),
),
)
.pipe(gulp.dest('dist'))
})API
transform accepts any number of transformer functions.
A transformer function takes a Cheerio Object as input (it's pretty much like jquery), and returns a Promise when done.
// Example transformer function
const transformer = async $ => {
$('img').attr('src', 'https://i.imgur.com/HObogkM.gif')
}