vitepress-plugin-mermaid

Add mermaid support for Vitepress. It detects any dark theme that are set in body as long as it has dark in the name

See the docs 📕
and a complex example 😎

Install

npm i vitepress-plugin-mermaid -s

Setup it up

Add plugin

//.vite.config.ts
import { defineConfig } from "vite";
import { MermaidPlugin } from "vitepress-plugin-mermaid";

export default defineConfig({
  plugins: [MermaidPlugin()],
});

Add markdown

// .vitepress/config.js

import MermaidPlugin from "vitepress-plugin-mermaid";

module.exports = {
  ...
  markdown: {
    config: MermaidPlugin,
  },
  ...
}

Use in any Markdown file

```mermaid
flowchart TD
  Start --> Stop
```