This plugin lazy loads image processed by gatsby-remark-im ages plugin
Lazyloads images processed by gatsby-remark-images with using lazysizes
The plugin makes lazyload possible by:
src
and srcset
to data-src
and data-srcset
respectively.lazyload
to img
tag.lazysizes has to be installed to make this plugin work.
npm install --save gatsby-remark-lazy-load
npm install --save lazysizes
// In your gatsby-config.js
plugins: [
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-images`,
},
`gatsby-remark-lazy-load`,
]
}
}
]
// In your gatsby-browser.js
import 'lazysizes'
This is a minimum plugin. Please make an issue when you need more functionalities or code doesn't work!