personal-homepage/src/_11ty/imageShortcode.js

31 lines
646 B
JavaScript

const Image = require('@11ty/eleventy-img')
const imageShortcode = async (
relativeSrc,
alt,
className,
widths = [null, 300, 800, 1280],
formats = ['webp'],
sizes = '(min-width: 100px)'
) => {
const imageMetadata = await Image(relativeSrc, {
widths,
formats,
outputDir: './_site/assets/images/generated/',
urlPath: '/assets/images/generated/',
})
const imageAttributes = {
alt,
sizes,
loading: 'lazy',
decoding: 'async',
}
if(className) {imageAttributes['class'] = className }
return Image.generateHTML(imageMetadata, imageAttributes)
}
module.exports.imageShortcode = imageShortcode;