@11ty/eleventy-img
Utility to perform build-time image transformations.
SVG 인라인 방법
- Adding inline SVGs to Eleventy.js - simpixelated.com
- Manage your SVG files with Eleventy’s Render plugin | chriskirknielsen - Eleventy 플러그인 및 필터 개발 방법에 대한 설명 1
const Image = require("@11ty/eleventy-img")
module.exports = function (eleventyConfig) {
eleventyConfig.addNunjucksAsyncShortcode("svgIcon", async filename => {
const metadata = await Image(`./src/_includes/assets/${filename}`, {
formats: ["svg"],
dryRun: true,
})
return metadata.svg[0].buffer.toString()
})
return config
}
With that in place, I could inline an SVG file anywhere I needed it in my templates using Nunjucks, like so:
See also
Favorite site
References
-
Manage_your_SVG_files_with_Eleventy_Render_plugin_-_chriskirknielsen.pdf ↩