Function createEleventyPlugin

An Eleventy plugin that prerenders banira components at build time: it registers the components in options.files and adds a transform that rewrites matching tags in the generated HTML into Declarative Shadow DOM (the role WebC plays for 11ty), preserving attributes and slotted children. So a vanilla banira component used in an Eleventy template renders — shadow DOM and all — before any JavaScript.

Wire it up in .eleventy.js:

import { createEleventyPlugin } from 'banira';
export default function (eleventyConfig) {
  eleventyConfig.addPlugin(createEleventyPlugin({ files: ['src/my-circle.ts'] }));
}
Copy

The renderer is created lazily on first use and reused across the build, then torn down on Eleventy's eleventy.after event.