How to render mermaid diagrams in .md files?

[laubonghaudoi]

For example I have a file readme.md, which looks like this:

Title

Some texts

Loading

graph LR
    Start --> Stop

Some other texts

Right now the mermaid diagram isn't rendered, it is just rendered as code blocks. How to make it rendered as diagrams?

[ChristianMurphy]

By using a remark plugin https://github.com/temando/remark-mermaid

[laubonghaudoi]

By using a remark plugin https://github.com/temando/remark-mermaid

Thanks but this is for remark? Not the react-markdown of this repo.

[ChristianMurphy]

@laubonghaudoi this project is built on remark, and supports remark plugins.
From the docs:

• plugins - array An array of unified/remark parser plugins. If you need to pass options to the plugin, pass an array with two elements, the first being the plugin and the second being the options - for instance: {plugins: [[require('remark-shortcodes'), {your: 'options'}]]. (default: []) Note that not all plugins can be used.