
At the request of @marpants this adds support for mermaid diagrams to our shared MDX pipeline. Diagrams can be created by using a fenced code block using the `mermaid` language. I did not verify to what extend this bloats the bundle. Perhaps that's something we need to look into later and consider the trade-off. For now, my main concern is to keep a new contributor happy, so here it goes :)
1,017 B
1,017 B
title | order |
---|---|
Code and code blocks | 80 |
Especially for our developer documentation, there's a lot of times we include source code in the documentation. You can make these look pretty by using a code block.
The basic use is to wrap your code in three backtick characters on a line:
```
let me = 'you'
```
Gives you:
let me = 'you'
This is a generic code block. But we also support syntax highlighting. To do so, add the language specifier after the opening backticks:
```js
let me = 'you'
```
To get:
let me = 'you'
The following language codes are supported:
js
for JavaScript codemarkdown
for Markdownhtml
for HTMLsvg
for SVGbash
for Bash or shell scriptsmdx
for MDXjsx
for JSXjson
for JSON
Note that mermaid
code blocks will be rendered as
Mermaid diagrams. Refer to the docs on custom
tags for an example.