Agent skill · writing content · howell5
vitepress-tutorial
Generate VitePress documentation sites for source code learning and analysis. Use when creating tutorials that explain how a codebase is implemented internally.
Why this skill is useful
Generates a structured VitePress documentation site with specific content generation rules and project setup tailored for codebase analysis.
What it needs
Requires pnpm, vitepress installed locally. About 4k tokens when loaded. Last updated 2026-04-25. 1 stars on the source repository.
What this skill does
VitePress Source Tutorial Generator Generate VitePress documentation sites for source code learning and analysis. Overview This skill creates standalone VitePress tutorial sites that teach developers how a codebase works internally. Unlike user documentation that explains "how to use", these tutorials explain "how it's implemented". Usage Examples: /vitepress-tutorial 帮我解析这个仓库的架构 /vitepress-tutorial explain the agent system in detail Workflow Phase 1: Project Analysis & Setup (REQUIRED FIRST) 1. Detect project type - Identify language, framework, monorepo structure 2. Ask user for preferences - Use AskUserQuestion tool to confirm: Output directory path (suggest reasonable default based on project structure) Tutorial focus areas (if not specified in the task) Content language(s) - Which language(s) to generate content in (see Language Selection below) 3. Create project skeleton immediately - After user confirms: Create directory structure Write package.json with Mermaid plugin Write .vitepress/config.ts Write pnpm-workspace.yaml (if inside another workspace) Run pnpm install Phase 2: Deep Analysis 1. Explore source directory using Task tool with Explore agent 2. Identify key components, patterns, and architecture 3. Map dependencies and data flows 4. Build mental model of module interactions Phase 3: Content Generation 1. Generate all documentation files based on analysis 2. Include Mermaid diagrams for architecture visualization 3. Reference actual source code with file:line annotations 4. Build and verify the site works CRITICAL INSTRUCTIONS Ask Before Writing ALWAYS use AskUserQuestion to confirm output location AND content language before creating any files. Use two questions in one AskUserQuestion call: Language Selection Rules Max 2 languages - If user selects more than 2, ask them to narrow down. Mention they can run the skill again later to add more languages. Single language - Generate content directly under docs/ with no locale prefix. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills howell5/vitepress