Mermaid
Nextra 支援 mermaid 圖表。如同在 GitHub 中,您可以透過使用 mermaid
程式碼區塊語言在 Markdown 檔案中使用它。Nextra 預設使用 @theguild/remark-mermaid
套件,該套件會將程式碼區塊替換為 <Mermaid>
組件。
範例
用法
Markdown
```mermaid
graph TD;
subgraph AA [Consumers]
A[Mobile app];
B[Web app];
C[Node.js client];
end
subgraph BB [Services]
E[REST API];
F[GraphQL API];
G[SOAP API];
end
Z[GraphQL API];
A --> Z;
B --> Z;
C --> Z;
Z --> E;
Z --> F;
Z --> G;
```