如何安装美人鱼来以降价方式呈现流程图？ [英] How to install Mermaid to render flowcharts in markdown?

问题描述

我正在尝试使用Mermaid在标记文件中呈现流程图。我的GitHub存储库中有一个ReadMe.md文件，我想包括一个基本流程图来帮助描述内容。但我想不出怎么才能让它起作用。有人能发布一些关于如何呈现简单示例的更具体的说明吗？

在此链接(https://unpkg.com/mermaid@8.0.0-rc.8/README.md)中，有一个美人鱼安装示例代码片段：

    ```
    https://unpkg.com/mermaid@7.1.0/dist/
    ```

我包含了该代码，然后尝试在下一个代码片段中制作流程图：

    ```
    graph TD;
        A-->B;
        A-->C;
        B-->D;
        C-->D;
    ```

但它所做的只是在我预览标记文件时将文本打印出来。

基于美人鱼自述：https://github.com/knsv/mermaid/blob/master/README.md似乎是可能的。但当我查看代码时，它实际上是流程图的图片，而不是代码的呈现。所以也许我的要求是不可能的？

感谢您的帮助！

推荐答案

不幸的是，GitHub风格的标记不支持呈现美人鱼图形。请参阅this issue了解更多信息，并从其他人对此功能的追求中找到安慰；)

如果您使用的是VS Code，您可以使用this extension在markdown中预览您的美人鱼代码块，但是请注意，一旦您将其放到GitHub上，它就不会呈现出来。要在GitHub上包含图表，您必须将其呈现为文件，尽管有人建议以某种方式使用online mermaid editor呈现它并检索呈现版本的URL。

实际上，让我尝试从前面提到的页面上的链接插入示例图表.而且，没有。我们收到Failed to upload image; the format is not supported-错误。

所以您需要先将其另存为图像。

这篇关于如何安装美人鱼来以降价方式呈现流程图？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！