Tags

external
Vue.js
Rich text

Svelte rich text renderer

For Svelte, there is a helper library that makes the integration process of rich texts very simple.

To install, use npm or another package manager:

npm install @caisy/rich-text-svelte-renderer --save

For ease of use, just pass the JSON and the component will convert it to HTML:

<script lang="ts">
import { RichTextRenderer } from '@caisy/rich-text-svelte-renderer';
...
</script>
{#if data.text && data.text.json}
	<RichTextRenderer node={data.text.json} />
{/if}

to ensure that you pass the correct object, it should contain something like this:

{ type: "doc", ... }

An example using the rich text render with Svelte can also be found here on Stackblitz:
https://stackblitz.com/github/caisy-io/caisy-example-sveltekit

Tags

external
Vue.js
Rich text