在 mermaid 中註冊圖示包

可用的圖示包可在 icones.js.org 找到。我們使用註冊圖示包時定義的名稱，來覆寫 iconify 包的前綴欄位。這允許使用者使用較短的圖示名稱。它也允許我們僅在圖表中使用了特定的圖示包時才載入它。

直接從 CDN 使用 JSON 檔案

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

使用延遲載入

import mermaid from 'mermaid';

mermaid.registerIconPacks([
  {
    name: 'logos',
    loader: () => import('@iconify-json/logos').then((module) => module.icons),
  },
]);

不使用延遲載入

import mermaid from 'mermaid';
import { icons } from '@iconify-json/logos';
mermaid.registerIconPacks([
  {
    name: icons.prefix, // To use the prefix defined in the icon pack
    icons,
  },
]);

在 mermaid 中註冊圖示包 ​

在 mermaid 中註冊圖示包