A plugin for Typesite that allows you to render JSX to HTML easily, even if you want to have multiple JSX fragments in the same file.
npm install typesite-filter-out
How to use
JsxRendererPlugin plugin in your Typesite project:
JsxContentsMeta to the frontmatter of whatever files you want to have JSX contents. It takes a callback which will be given
Typesite as params and will expect you to return
This will overwrite content sent by just having a string in the frontmatter.
Multiple JSX fragments
If you want to have multiple JSX fragments in one file, for example a summary for a blog post, you first have to create a new class extending
It's absolutely necessary to override
getKey! Then register the meta in frontmatter:
You can later access its contents as string with:
Important: when you have multiple metas extending
JsxContentsMeta only the base one will be transferred to
The plugin responsible for rendering the JSX metas:
removeDataReactRoot :booleanControls wheteher to remove any and all
data-reactrootattributes that might appear
Meta class that builds the JSX for the page's contents:
render: (path:string, file:ContentFile, files:ContentFileCollection, typesite:Typesite) => JSX.ElementA function that expects file path, rendered file, files collection & typescite instace and should return
JSX.Elementwith the page's contents which will later be rendered to string.
renderis not a function
contents:stringThe rendered JSX