Skip to content

eFrane/vuepress-plugin-mermaidjs

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

211 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

npm version Build Status

VuePress Plugin for mermaid.js

Use mermaid.js Diagrams in VuePress

This VuePress plugin provides a global component wrapping mermaid.js. The plugin is designed to work with VuePress v1.x.

Main documentation site is at vuepress-plugin-mermaidjs.efrane.com.

Installation

VuePress 2 Support is currently in beta testing, see below.

You can install it with

yarn add -D vuepress-plugin-mermaidjs

or

npm install --save-dev vuepress-plugin-mermaidjs

Then you just need to register the plugin in your .vuepress/config.js:

module.exports = {
    // ...
    plugins: [
        'vuepress-plugin-mermaidjs'
    ]
    // ...
}

Usage

The recommended usage is to place your mermaidjs diagrams inside a fenced code block with the language 'mermaid':

```mermaid
sequenceDiagram
Alice->John: Hello John, how are you?
loop every minute
    John-->Alice: Great!
end
```

VuePress 2 Support

You can use this plugin with the upcoming (next) release of VuePress aka VuePress 2. To do so, use version 2.0.0-beta.1 or above.

About

Vuepress plugin for mermaid.js diagrams

Topics

Resources

Stars

Watchers

Forks

Sponsor this project

 

Packages

 
 
 

Contributors