wiki-vitepress

Wiki VitePress Packager

Transform generated wiki Markdown files into a polished VitePress static site with dark theme and interactive Mermaid diagrams.

When to Use

• User asks to "build a site" or "package as VitePress"
• User runs the /deep-wiki:build command
• User wants a browsable HTML output from generated wiki pages

VitePress Scaffolding

Generate the following structure in a wiki-site/ directory:

wiki-site/
├── .vitepress/
│   ├── config.mts
│   └── theme/
│       ├── index.ts
│       └── custom.css
├── public/
├── [generated .md pages]
├── package.json
└── index.md

Config Requirements (config.mts)

• Use withMermaid wrapper from vitepress-plugin-mermaid
• Set appearance: 'dark' for dark-only theme
• Configure themeConfig.nav and themeConfig.sidebar from the catalogue structure
• Mermaid config must set dark theme variables:

mermaid: {
  theme: 'dark',
  themeVariables: {
    primaryColor: '#1e3a5f',
    primaryTextColor: '#e0e0e0',
    primaryBorderColor: '#4a9eed',
    lineColor: '#4a9eed',
    secondaryColor: '#2d4a3e',
    tertiaryColor: '#2d2d3d',
    background: '#1a1a2e',
    mainBkg: '#1e3a5f',
    nodeBorder: '#4a9eed',
    clusterBkg: '#16213e',
    titleColor: '#e0e0e0',
    edgeLabelBackground: '#1a1a2e'
  }
}

Dark-Mode Mermaid: Three-Layer Fix

Layer 1: Theme Variables (in config.mts)

Set vi