svelte-exmarkdown

svelte-exmarkdown

Svelte component to render markdown. Dynamic and Extensible.

Motivation

svelte-markdown is a good component package. However, it is not extensible. You cannot use custom syntax(e.g. KaTeX).

MDsveX is another good package. However, it is a preprocessor. Not suitable for dynamic rendering.

We need pluggable and dynamic markdown renderer in svelte like react-markdown.

Usage

<script>
	import Markdown from 'svelte-exmarkdown';
	let md = $state('# Hello world!');
</script>

<textarea bind:value={md}></textarea>
<Markdown {md} />

with GFM

<script>
	import Markdown from 'svelte-exmarkdown';
	import { gfmPlugin } from 'svelte-exmarkdown/gfm';
	let md = $state('# Hello world!');
	const plugins = [gfmPlugin()];
</script>

<textarea bind:value={md}></textarea>
<Markdown {md} {plugins} />

Playground & Documents

https://ssssota.github.io/svelte-exmarkdown