A 11ty plugin to render MermaidJS graphs ✨

I love eleventy! It’s an incredibly flexible, fast, and fun static site generator. If I was to build a single-page website or a page for a open source tool I’d choose it any day.

The eleventy-plugin-mermaid plugin extends the Markdown renderer of eleventy and adds the ability to create code blocks with the mermaid language which will be turned into SVGs on page load.

The code may look like this

graph TD;
A[Want graphs in 11ty] -->|Search Plugin| B(Found plugin);
B --> C{Use plugin?};
C -->|Yes| D[NICE GRAPHS];
C -->|No| E[NO GRAPHS];

Since the plugin is written in JavaScript it can be easily installed with NPM by typing

npm install @kevingimbel/eleventy-plugin-mermaid