如何一起使用Codehilite和美人鱼?

时间:2020-06-11 20:28:51

标签: mkdocs mermaid

我们使用带有主题主题的mkdocs生成文档,并且到目前为止,已经使用了codehilite扩展。我现在使用此处描述的方法添加了美人鱼:https://github.com/squidfunk/mkdocs-material/issues/693

首先,我的降价:

# Examples

## Mermaid
```mermaid
graph LR
    a[Start] -- b[(Storage)]-->d[End]
```
## Code

```
#!/usr/bin/python
import tensorflow as tf
```

我的mkdocs.yml:

# Project information
site_name: Test
site_description: 'Mermaid with CodeHiLite'

theme:
   name: material
   feature:
      tabs: false

extra_javascript:
   - 'custom_content/mermaid.min.js'

markdown_extensions:
   - codehilite

在此配置中,美人鱼代码不是呈现为图表,而是代码突出显示了语法。

Codehilite

如果我扩展我的mkdocs.yml以添加美人鱼,如下所示:

# Project information
site_name: Test
site_description: 'Mermaid with CodeHiLite'
theme:
   name: material
   feature:
      tabs: false

extra_javascript:
   - 'custom_content/mermaid.min.js'

markdown_extensions:
   - codehilite
   - pymdownx.superfences:
       custom_fences:
         - name: mermaid
           class: mermaid
           format: !!python/name:pymdownx.superfences.fence_div_format

然后正确绘制了美人鱼图,但代码未突出显示语法。

Mermaid

如果我更改markdown以将语言添加到代码块中

``` python
#!/usr/bin/python
import tensorflow as tf
```

然后正确显示代码和图表。我的问题是现有文档没有指定语言,直到现在仍然有效。

任何想法如何使这两个扩展更好地协同工作?还是我只需要告诉开发人员更新其降价促销?

1 个答案:

答案 0 :(得分:0)

对于将美人鱼图集成到mkdocs中的预打包解决方案,现在有一个mkdocs-mermaid2插件,我正在维护。

为了突出显示代码,它还包含一个如何使其与superfences插件一起工作的示例。

如果需要使用pass arguments到美人鱼渲染器的initialize()方法来调整图表外观,这可能特别有用。