5

It is possible to make work mermaid inside \.md file with MyST md driver ?

For now the only way I found is

$ tail conf.py
extensions = [ 'recommonmark', 'sphinxcontrib.mermaid']
from recommonmark.transform import AutoStructify
def setup(app):
    app.add_transform(AutoStructify)
$

The below is rendered with recommonmark:

```mermaid::

  graph LR
    a --> b
```

but not with MyST-parser

I have open this issue in MyST: https://github.com/executablebooks/MyST-Parser/issues/366

Note: recommonmark does not render correctly tables that's why I try to use MyST-parser

user3313834
  • 7,327
  • 12
  • 56
  • 99
  • Notice that recommonmark is deprecated in favor of myst-parser https://github.com/readthedocs/recommonmark/issues/221 – astrojuanlu May 06 '21 at 19:39

3 Answers3

8

mermaid is prefectly integrated to MyST-parser.

You only need to call it like that with {mermaid}:

```{mermaid}
graph LR
  a --> b
```

No need to define in conf.py a def setup(app): only:

extensions = ['myst_parser', 'sphinxcontrib.mermaid']
AlexTorx
  • 753
  • 4
  • 9
  • Why `{mermaid}` instead of the usual `mermaid`? – endolith Mar 19 '23 at 23:58
  • 1
    This what is recommended from official sphinxcontrib-mermaid README documentation (see https://github.com/mgaitan/sphinxcontrib-mermaid#markdown-support). This is also the standard recommended from myST-parser for using Sphinx directives (see https://myst-parser.readthedocs.io/en/v0.13.5/using/syntax.html#extended-block-tokens) – AlexTorx Apr 15 '23 at 09:24
1

As of myst-parser 0.19.2 you can use the regular markdown syntax with mermaid instead of {mermaid}.

This way previews (e.g. on GitHub or in your editor) will also work properly.

The minimal conf.py change that is needed looks like this:

extensions = ['myst_parser', 'sphinxcontrib.mermaid']
myst_fence_as_directive = ["mermaid"]
s-weigand
  • 11
  • 1
  • 1
  • 4
0

Tips: Need to pip install sphinxcontrib-mermaid

from myst-parser

SWHL
  • 1
  • 1