Hugo Stack 主题添加 Mermaid 支持

参考:

在 layouts 添加如下文件:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
<!-- layouts/_markup/render-codeblock-mermaid.html -->
<pre class="mermaid">
  {{ .Inner | htmlEscape | safeHTML }}
</pre>

{{ if not (.Page.Scratch.Get "mermaidLoaded") }}
    {{ .Page.Scratch.Set "mermaidLoaded" true }}
    <script type="module">
        import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
        mermaid.initialize({ startOnLoad: true, theme: 'neutral' });
    </script>
{{ end }}

在黑暗模式下显示比较有问题, 我没有折腾比较好的解决方案

Hugo

Hugo Theme - Stack