antfu avatar

Vitepress

antfu/skills
4.1k

VitePress is a static site generator built on Vite and Vue 3, ideal for creating documentation, blogs, and marketing sites with fast navigation and seamless Markdown integration. It supports features like file-based routing, Vue components in Markdown, theme customization, and built-in search, making it suitable for developers looking to build efficient, Vue-powered static websites. The skill provides comprehensive guidance on configuration, routing, Markdown, theming, and advanced functionalities such as internationalization and server-side rendering.

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

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 1.x, generated at 2026-01-28.

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

GitHub Owner

Owner: antfu

Files

core-config

core-cli

core-routing

core-markdown

features-code-blocks

features-vue

features-data-loading

features-dynamic-routes

theme-config

theme-customization

theme-custom

advanced-i18n

advanced-ssr

recipes-deploy

SKILL.md


name: vitepress description: VitePress static site generator powered by Vite and Vue. Use when building documentation sites, configuring themes, or writing Markdown with Vue components. metadata: author: Anthony Fu version: "2026.1.28" source: Generated from https://github.com/vuejs/vitepress, scripts located at https://github.com/antfu/skills

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 1.x, generated at 2026-01-28.

Core

TopicDescriptionReference
ConfigurationConfig file setup, defineConfig, site metadatacore-config
CLICommand-line interface: dev, build, preview, initcore-cli
RoutingFile-based routing, source directory, rewritescore-routing
MarkdownFrontmatter, containers, tables, anchors, includescore-markdown

Features

Code & Content

TopicDescriptionReference
Code BlocksSyntax highlighting, line highlighting, diffs, focusfeatures-code-blocks
Vue in MarkdownComponents, script setup, directives, templatingfeatures-vue
Data LoadingBuild-time data loaders, createContentLoaderfeatures-data-loading
Dynamic RoutesGenerate pages from data, paths loader filesfeatures-dynamic-routes

Theme

TopicDescriptionReference
Theme ConfigNav, sidebar, search, social links, footertheme-config
CustomizationCSS variables, slots, fonts, global componentstheme-customization
Custom ThemeBuilding themes from scratch, theme interfacetheme-custom

Advanced

TopicDescriptionReference
InternationalizationMulti-language sites, locale configurationadvanced-i18n
SSR CompatibilityServer-side rendering, ClientOnly, dynamic importsadvanced-ssr

Recipes

TopicDescriptionReference
DeploymentGitHub Pages, Netlify, Vercel, Cloudflare, Nginxrecipes-deploy

More skills