Mermaid rendering for Nuxt Content with lazy loading, SSR-safe rendering, and theme support.
翻譯準備中
取自儲存庫 README
正在載入完整 README。
檢視完整 README ↗This README covers 4.x, which bundles Mermaid 12. The frozen 3.x line keeps its 3.x contract; to upgrade, follow Migration to v4.
@barzhsieh/nuxt-content-mermaid turns mermaid code blocks in Nuxt
Content Markdown into responsive, interactive diagrams. It supports lazy
loading, light and dark themes, toolbar controls, and application-provided
rendering components.
The documentation website is the canonical package documentation. This README is a bounded distribution summary for npm and GitHub.
Use this module when your Nuxt Content application needs to:
The module owns its compatible Mermaid version. Applications own their Nuxt and Nuxt Content peer dependencies and the Nuxt Content database connector.
>=22.19.0^4.1.0>=3.5.0 <4.0.017.4+For dependency ownership, the v4 migration boundary, and rendering guarantees, see the 4.x Dependency and Migration Contract.
Install the module and its Nuxt Content peer:
pnpm add @barzhsieh/nuxt-content-mermaid @nuxt/content
Register the module:
export default defineNuxtConfig({
modules: ['@barzhsieh/nuxt-content-mermaid'],
})
Then add a Mermaid fence to a Content Markdown file:
```mermaid
flowchart LR
Markdown --> Content --> Mermaid --> SVG
```
Mermaid is included by the module and does not need to be installed separately. For database connector choices and a complete first-project walkthrough, follow Getting Started.
If the module is useful to you, you can support my open-source work on Ko-fi.
Contributions are welcome. Open an issue or submit a pull request with a clear summary and test results. Maintainers should follow the stable release runbook.