11ty-stenciljs-ssr-example icon indicating copy to clipboard operation
11ty-stenciljs-ssr-example copied to clipboard

Example of using server rendered Stencil components in 11ty

Example of using 11ty and Stencil components with SSR

This is a early demo of using server rendered Stencil components in 11ty

which is possible by adding a transform in .eleventy.js

config.addTransform("ssr", async (content, outputPath) => {
  if (outputPath.endsWith(".html")) {
    try {
      const { html } = await renderToString(content);
      return html;
    } catch (error) {
      return error;
    }
  }
  return content;
});

demo

See it in action!

dev

pnpm i
pnpm build
pnpm serve

more info coming soon!