svelte-preprocess-markdown
Allows to import *.md
files as Svelte component. Very useful when your components have a lot of formatted texts and you doesn't want to write it in HTML. It is based on superfast Marked markdown parser.
Documentaton
- Please, see the Docs for more info
- Or try yourself in the our Playground
Installation
Install package:
npm i -D svelte-preprocess-markdown
Then, edit rollup.config.js
file:
// 1. import packageconst markdown = ; // ... plugins:
Usage
Common usage
<script> import Child from './Child.svelte'; let name = 'world';</script> # Hello {name}! This is text in `markdown` **notation** <Child /> <style> h1{ color:red }</style>
MDSv usage
The MDSv
format is MDX-like way to write documents using imported Svelte-components.
import Block from './Block.svelte';import { data } from './my_data.js'; # The MDSv example You can use *components* and a *logic* inside doc: <Block color="red"> My `data` list: {#each data as item} {item} {/each}</Block>
Options
You can pass any options that are accepted by Marked.
...plugins: ...
Renderer
If you need renderer
object for options, you can get it from the package:
const Renderer = ; const renderer = ; renderer { ...}; const options = renderer;