Vitepress

What it does

VitePress static site generator powered by Vite and Vue. Use when building documentation sites, configuring themes, or writing Markdown with Vue components.

Install

npx skills add https://github.com/antfu/skills --skill vitepress

Website

www.skills.sh/antfu/skills/vitepress

Details

From the skill’s SKILL.md or README, by its authors. View the original

VitePress is a Static Site Generator (SSG) built on Vite and Vue 3. It takes Markdown content, applies a theme, and generates static HTML that becomes an SPA for fast navigation. Perfect for documentation, blogs, and marketing sites.

Key Characteristics:

File-based routing with .md files
Vue components work directly in Markdown
Fast HMR with instant updates (<100ms)
Default theme optimized for documentation
Built-in search (local or Algolia)

Before working with VitePress projects:

Check .vitepress/config.ts for site configuration
Look at .vitepress/theme/ for custom theme extensions
The public/ directory contains static assets served as-is

> The skill is based on VitePress 2.0.0-alpha.20, generated at 2026-09-25.

VitePress 2 notes (v1 → v2): install with vitepress@next; requires Node.js 22+. defineConfigWithTheme is deprecated — use defineConfig. Native RTL support (dir option, CSS logical properties) replaces the old PostCSS-plugin approach. Built-in iconify pipeline (icons config, useIcon/VPIcon, collection:name social icons). New assetsBase (CDN) and assetsShards build options; metaChunk removed. Markdown image.lazyLoading renamed to image.lazyLoad.

Core

Topic	Description	Reference
Configuration	Config file setup, defineConfig, site metadata	core-config
CLI	Command-line interface: dev, build, preview, init	core-cli
Routing	File-based routing, source directory, rewrites	core-routing
Markdown	Frontmatter, containers, tables, anchors, includes	core-markdown

Features

Code & Content

Topic	Description	Reference
Code Blocks	Syntax highlighting, line highlighting, diffs, focus	features-code-blocks
Vue in Markdown	Components, script setup, directives, templating	features-vue
Data Loading	Build-time data loaders, createContentLoader	features-data-loading
Dynamic Routes	Generate pages from data, paths loader files	features-dynamic-routes

Theme

Topic	Description	Reference
Theme Config	Nav, sidebar, search, social links, footer	theme-config
Customization	CSS variables, slots, fonts, global components	theme-customization
Custom Theme	Building themes from scratch, theme interface	theme-custom

Advanced

Topic	Description	Reference
Internationalization	Multi-language sites, locale configuration	advanced-i18n
SSR Compatibility	Server-side rendering, ClientOnly, dynamic imports	advanced-ssr

Recipes

Topic	Description	Reference
Deployment	GitHub Pages, Netlify, Vercel, Cloudflare, Nginx	recipes-deploy

See all

Writing & docs
Grill With Docs
A relentless interview to sharpen a plan or design, which also creates docs (ADR's and glossary) as we go.
npx skills add https://github.com/mattpocock/skills --skill grill-with-docs
1.3M installs
Writing & docs
Triage
Move issues and external PRs through a state machine of triage roles, categorise, verify, grill if needed, and write agent-ready briefs.
npx skills add https://github.com/mattpocock/skills --skill triage
1.1M installs
Writing & docs
Domain Modeling
Build and sharpen a project's domain model. Use when discussing codebase terminology, writing or editing a GLOSSARY.md, or recording or editing an ADR.
npx skills add https://github.com/mattpocock/skills --skill domain-modeling
952.2K installs
Writing & docs
Writing Beats
Writing, exploit; assemble raw material into a journey of beats, grounding each term before a beat leans on it.
npx skills add https://github.com/mattpocock/skills --skill writing-beats
528.6K installs

Skills are shared by members and not reviewed by us. Read a skill’s code before you install it.