在 Mermaid 中注册图标包
可用的图标包可以在 icones.js.org 找到。 我们使用注册图标包时定义的名称来覆盖 iconify 包的 prefix 字段。这允许用户为图标使用更短的名称。它也允许我们仅在图表中使用图标包时才加载该包。
直接使用 CDN 上的 JSON 文件:
javascript
import mermaid from 'CDN/mermaid.esm.mjs';
mermaid.registerIconPacks([
{
name: 'logos',
loader: () =>
fetch('https://unpkg.com/@iconify-json/logos@1/icons.json').then((res) => res.json()),
},
]);
使用包和打包器:
bash
npm install @iconify-json/logos@1
使用懒加载:
javascript
import mermaid from 'mermaid';
mermaid.registerIconPacks([
{
name: 'logos',
loader: () => import('@iconify-json/logos').then((module) => module.icons),
},
]);
不使用懒加载:
javascript
import mermaid from 'mermaid';
import { icons } from '@iconify-json/logos';
mermaid.registerIconPacks([
{
name: icons.prefix, // 使用图标包中定义的前缀
icons,
},
]);