Feature request: support mermaid.js

[WingLim]

Hey there, thanks a lot for creating this program.

Is there has any plan to support mermaid.js?

Is great to write code to gernate diagram with mermaid rather than paste a image to slide.

[antfu]

I have never write graphs in Markdown, so I know very little about them. But sure, I am happy to have this feature as many could found it useful.

Do you mind to introduce me a few alternative to mermaid.js and what's the difference / trade-offs between them? So we can make the decision to choose the one that everybody would be happy with?

Thanks!

[WingLim]

Sure!

For convience, I will call their code rule which describes how to draw a graph as text.

There are three most popular js project to parse text to graphs:

• mermaid
• flowchart.js
• js-sequence-diagrams

The flowchar.js and js-sequence-diagrams just like their names, they can only do one thing:

flowchar.js turns text to rendered flowchar, something like this:

js-sequence-diagrams turns text to a rendered sequence diagrams, something like this:

mermaid is more powerful than the two project above, it supports sequence diagrams, flowcharts, Gantt charts, class and state diagrams, and pie charts.

So it means if you support mermaid, you can support nearly all diagrams which we can write in markdown.

[antfu]

Alright, let's go with mermaid. Basic functionality are implemented on https://github.com/slidevjs/slidev/tree/feat/mermaid