How do I activate the site building process?

You can activate the skill by asking Claude to 'build a site', 'package as VitePress', or by running the /deep-wiki:build command.

Does it support zooming for large diagrams?

Yes, it automatically injects a click-to-zoom feature that opens diagrams in a fullscreen modal for easier viewing.

How does it handle Mermaid diagrams in dark mode?

The skill applies a three-layer fix involving theme variables, CSS overrides, and inline style replacement to ensure Mermaid diagrams are perfectly legible in dark mode.

What is the wiki-vitepress skill?

It is a specialized Claude Code skill that automates the packaging of Markdown files into a professional VitePress static website with a dark theme and interactive diagrams.

What happens to existing Markdown files?

The skill scans all .md files and fixes common Vue compatibility issues, such as replacing tags and escaping bare generic parameters like before building.

Wiki VitePress Packager

Name: Wiki VitePress Packager
Author: alexander-kastil

byalexander-kastil

0•

学習とドキュメンテーション

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

This skill automates the conversion of raw Markdown files into a professional, browsable documentation website using VitePress. It handles the entire scaffolding process, including advanced configuration for a dark-only theme and specialized styling for Mermaid diagrams to ensure they render correctly in dark environments. With features like click-to-zoom for diagrams, automatic sidebar generation, and pre-build Markdown sanitization to ensure Vue compatibility, it provides a production-ready documentation solution without the need for manual setup.

主な機能

01Automatic Markdown sanitization for Vue template compatibility

020 GitHub stars

03Dynamic navigation and sidebar generation from file structure

04Automated VitePress scaffolding and site configuration

05Interactive click-to-zoom functionality for all diagrams

06Enhanced dark-mode Mermaid diagrams with three-layer styling fixes

ユースケース

01Packaging Claude-generated Markdown content into a shareable static site

02Converting a collection of research notes or a technical wiki into a browsable website

03Building a production-ready documentation site with complex diagrams

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add alexander-kastil/skills-collection wiki-vitepress

For use in Claude.ai and ChatGPT

Download Skill