Renderers

A renderer turns the elements a generator returns into FileNodes. Kubb ships a JSX renderer through kubb/jsx. Reach for createRenderer only when you want a different templating format.

createRenderer

createRenderer takes a builder function and returns a factory that produces a Renderer, the object a generator's renderer field points at.

kubb/jsx's own jsxRenderer ships as a plain factory and does not depend on createRenderer, so most plugin authors only reach for createRenderer when building an alternative to JSX rendering, for example a renderer that walks a different templating format into FileNodes.

Related

• Renderer concepts
• jsxRenderer, the shipped JSX renderer
• Creating plugins

jsxRenderer (via kubb/jsx)

For JSX-based rendering, import jsxRenderer from kubb/jsx, backed by the internal @kubb/renderer-jsx package.

jsxRenderer is a React-free recursive renderer. It walks the JSX components into FileNodes without a React reconciliation pass. Components run as plain functions, so hooks and suspense are not available.

renderer.ts

import { jsxRenderer } from 'kubb/jsx'

const renderer = jsxRenderer()

Set the renderer on a generator through its renderer field (renderer: jsxRenderer) to enable JSX-based output for that generator. Leave it unset, or pass renderer: null, to opt out of rendering.