How does it handle site navigation?

The skill automatically configures the VitePress navigation bar and sidebar based on your catalogue structure and the Markdown pages generated in your wiki.

Does it support interactive diagrams?

Yes, it adds a custom click-to-zoom feature for Mermaid diagrams, allowing users to view complex technical charts in a high-resolution fullscreen modal.

What makes this skill better than a standard VitePress setup?

This skill automates advanced configurations that are normally manual, such as fixing Mermaid diagram visibility in dark mode and ensuring Markdown files with code-like syntax (generic parameters) don't crash the Vue build.

Is the final output ready for hosting?

Absolutely. The skill runs a full production build and outputs optimized assets into the .vitepress/dist directory, ready for deployment to platforms like Netlify, Vercel, or GitHub Pages.

Wiki VitePress Packager

Name: Wiki VitePress Packager
Author: MarufCode

byMarufCode

0•

内容管理

Transforms generated Markdown wiki pages into a polished, dark-themed VitePress static site with interactive Mermaid diagrams.

The Wiki VitePress Packager skill streamlines the transition from flat Markdown files to a professional, browsable documentation website. It automates the complex scaffolding of a VitePress project, including specialized configurations for dark-only themes and advanced Mermaid diagram support. The skill solves common technical hurdles such as SSR-safe diagram rendering, click-to-zoom interactivity, and Vue template compatibility for Markdown files containing generic parameters. It is an essential tool for developers who need to quickly generate production-ready documentation portals from existing wikis or technical notes.

主要功能

01Interactive click-to-zoom functionality for all technical diagrams

02Dynamic navigation and sidebar generation from content structure

03Enhanced dark-mode Mermaid diagrams with persistent styling fixes

04Intelligent Markdown post-processing for Vue compiler compatibility

05Automated VitePress project scaffolding and directory structure

060 GitHub stars

使用场景

01Converting technical architecture notes with Mermaid diagrams into a polished site

02Generating production-ready static documentation for open-source repositories

03Creating an internal browsable documentation portal from local wiki pages

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add marufcode/antigravity-skills wiki-vitepress

For use in Claude.ai and ChatGPT

Download Skill