gulp-image-lqip

Parses your HTML files to find images and adds a data-src attribute to them which contains their Base64 representation.

Install

npm install --save-dev gulp-image-lqip

Usage

const gulp = require('gulp');
const gulpImgLqip = require('gulp-image-lqip');
gulp.task('default', () => {
  return gulp.src('*.html')
    // `gulp-image-lqip` needs filepaths
    // so you can't have any plugins before it
    .pipe(gulpImgLqip(__dirname))
})

Supported files

Currently ['jpeg', 'jpg', 'png', 'gif'] files are supported.

API

gulpImgLqip(rootPath, options)

rootPath

Type: string
Required

Define the rootPath of your website, it must be an absolute path.

options

Type: Object

attribute

Type: string
Default: data-src

Attribute which will contain the Base64 representation of your image.

pretty

Type: Boolean
Default: true

Use pretty to beautify the HTML files.

srcAttr

Type: string
Default: src

Attribute which contain your image.

Support me

If you want to thank me or support my work:

You can become my Patron
Or buy me a coffee: PayPal

Thanks

Thanks lqip for the inspiration