hugo加入mermaid作图

1、画图

vi content/post/first.md

draft: false

#添加下面代码
<div class="mermaid">
graph LR
    A --- B
    B-->C[fa:fa-ban forbidden]
    B-->D(fa:fa-spinner);
</div>

2、添加mermaid脚本

vi ./themes/hugo-theme-learn/layouts/partials/footer.html

#添加下面代码
  <!-- mermaid JS -->
  <script src="https://mermaidjs.github.io/scripts/mermaid.min.js"></script>
  <script>
        mermaid.initialize({ startOnLoad: true });
  </script>

3、运行服务

hugo server --bind="0.0.0.0" -v -w -p 1313  --theme=hyde  -b http://206.22.195.233:1313

4、访问网站

http://206.22.195.233:1313/post/first

hugo加入mermaid作图