Maison

Skill

Développement Web

vitepress

antfu/skills

Créez des sites de documentation, configurez des thèmes et rédigez du Markdown avec des composants Vue en utilisant le générateur de sites statiques VitePress.

...Développer tout

Heure mise à jour 7 septembre 2026

# documentation # markdown # vue # ssg # static site generator # vitepress

VitePress est un Générateur de Sites Statiques (SSG) construit sur Vite et Vue 3. Il prend du contenu Markdown, applique un thème et génère du HTML statique qui devient une SPA pour une navigation rapide. Parfait pour la documentation, les blogs et les sites marketing.

Caractéristiques principales :

Routage basé sur les fichiers avec des fichiers .md
Les composants Vue fonctionnent directement dans le Markdown
HMR rapide avec des mises à jour instantanées (
Thème par défaut optimisé pour la documentation
Recherche intégrée (locale ou Algolia)

Avant de travailler avec des projets VitePress :

Vérifiez .vitepress/config.ts pour la configuration du site
Consultez .vitepress/theme/ pour les extensions de thème personnalisées
Le répertoire public/ contient des ressources statiques servies telles quelles

La compétence est basée sur VitePress 1.x, générée le 2026-01-28.

Cœur

Sujet	Description	Référence
Configuration	Configuration du fichier, defineConfig, métadonnées du site	core-config
CLI	Interface en ligne de commande : dev, build, preview, init	core-cli
Routage	Routage basé sur les fichiers, répertoire source, réécritures	core-routing
Markdown	Frontmatter, conteneurs, tableaux, ancres, inclusions	core-markdown

Fonctionnalités

Code & Contenu

Sujet	Description	Référence
Blocs de code	Mise en évidence de la syntaxe, mise en évidence des lignes, diffs, focus	features-code-blocks
Vue dans Markdown	Composants, script setup, directives, templating	features-vue
Chargement de données	Chargeurs de données au moment de la construction, createContentLoader	features-data-loading
Routage dynamique	Générer des pages à partir de données, fichiers chargeur de chemins	features-dynamic-routes

Thème

Sujet	Description	Référence
Configuration du thème	Navigation, barre latérale, recherche, liens sociaux, pied de page	theme-config
Personnalisation	Variables CSS, emplacements, polices, composants globaux	theme-customization
Thème personnalisé	Création de thèmes à partir de zéro, interface de thème	theme-custom

Avancé

Sujet	Description	Référence
Internationalisation	Sites multilingues, configuration des locales	advanced-i18n
Compatibilité SSR	Render côté serveur, ClientOnly, imports dynamiques	advanced-ssr

Recettes

Sujet	Description	Référence
Déploiement	GitHub Pages, Netlify, Vercel, Cloudflare, Nginx	recipes-deploy

Voir sur GitHub

---
name: vitepress
description: Build documentation sites, configure themes, and write Markdown with Vue components using the VitePress static site generator.
---

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](references/core-config.md) |
| CLI | Command-line interface: dev, build, preview, init | [core-cli](references/core-cli.md) |
| Routing | File-based routing, source directory, rewrites | [core-routing](references/core-routing.md) |
| Markdown | Frontmatter, containers, tables, anchors, includes | [core-markdown](references/core-markdown.md) |

## Features

### Code & Content

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

## Theme

| Topic | Description | Reference |
|-------|-------------|-----------|
| Theme Config | Nav, sidebar, search, social links, footer | [theme-config](references/theme-config.md) |
| Customization | CSS variables, slots, fonts, global components | [theme-customization](references/theme-customization.md) |
| Custom Theme | Building themes from scratch, theme interface | [theme-custom](references/theme-custom.md) |

## Advanced

| Topic | Description | Reference |
|-------|-------------|-----------|
| Internationalization | Multi-language sites, locale configuration | [advanced-i18n](references/advanced-i18n.md) |
| SSR Compatibility | Server-side rendering, ClientOnly, dynamic imports | [advanced-ssr](references/advanced-ssr.md) |

## Recipes

| Topic | Description | Reference |
|-------|-------------|-----------|
| Deployment | GitHub Pages, Netlify, Vercel, Cloudflare, Nginx | [recipes-deploy](references/recipes-deploy.md) |