svelte-exmarkdown

Skip rendering the element

If you want to skip rendering the element, you can use renderer prop.

You can use null to skip rendering the element.

<script lang="ts">
	import type { Plugin } from 'svelte-exmarkdown';
	import Markdown from 'svelte-exmarkdown';

	let md = '# Skipped\n\n## Rendered';
	const plugins: Plugin[] = [{ renderer: { h1: null } }];
</script>

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

Rendered

Allowlist and Denylist

You can use allowlist and denylist to control which elements are allowed to render.

This example is same as above.

<script lang="ts">
	import type { Plugin } from 'svelte-exmarkdown';
	import Markdown, { denylist } from 'svelte-exmarkdown';

	let md = '# Skipped\n\n## Rendered';
	const plugins: Plugin[] = [denylist(['h1'])];
</script>

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

Rendered

If you want to support only some elements, you can use allowlist.

<script lang="ts">
	import type { Plugin } from 'svelte-exmarkdown';
	import Markdown, { allowlist } from 'svelte-exmarkdown';

	let md =
		'# Skipped\n\nOnly paragraph, *em*, **strong** and [link](https://example.com) are rendered';
	const plugins: Plugin[] = [allowlist(['p', 'em', 'strong', 'a'])];
</script>

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

Only paragraph, em, strong and link are rendered