Files
agent-skills/skills/vitepress/references/core-config.md
Jason Woltje f5792c40be feat: Complete fleet — 94 skills across 10+ domains
Pulled ALL skills from 15 source repositories:
- anthropics/skills: 16 (docs, design, MCP, testing)
- obra/superpowers: 14 (TDD, debugging, agents, planning)
- coreyhaines31/marketingskills: 25 (marketing, CRO, SEO, growth)
- better-auth/skills: 5 (auth patterns)
- vercel-labs/agent-skills: 5 (React, design, Vercel)
- antfu/skills: 16 (Vue, Vite, Vitest, pnpm, Turborepo)
- Plus 13 individual skills from various repos

Mosaic Stack is not limited to coding — the Orchestrator and
subagents serve coding, business, design, marketing, writing,
logistics, analysis, and more.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-16 16:27:42 -06:00

190 lines
4.1 KiB
Markdown

---
name: vitepress-configuration
description: Config file setup, defineConfig helper, site metadata, and build options
---
# Configuration
VitePress configuration is defined in `.vitepress/config.[js|ts|mjs|mts]`. Use `defineConfig` for TypeScript intellisense.
## Basic Config
```ts
// .vitepress/config.ts
import { defineConfig } from 'vitepress'
export default defineConfig({
// Site metadata
title: 'My Docs',
description: 'Documentation site',
lang: 'en-US',
// URL base path (for GitHub Pages: '/repo-name/')
base: '/',
// Theme configuration
themeConfig: {
// See theme-config.md
}
})
```
## Site Metadata
```ts
export default defineConfig({
title: 'VitePress', // Displayed in nav, used in page titles
titleTemplate: ':title - Docs', // Page title format (:title = h1)
description: 'Site description', // Meta description
lang: 'en-US', // HTML lang attribute
head: [
['link', { rel: 'icon', href: '/favicon.ico' }],
['meta', { name: 'theme-color', content: '#5f67ee' }],
['script', { async: '', src: 'https://analytics.example.com/script.js' }]
]
})
```
## Build Options
```ts
export default defineConfig({
// Source files directory (relative to project root)
srcDir: './src',
// Exclude patterns from source
srcExclude: ['**/README.md', '**/TODO.md'],
// Output directory
outDir: './.vitepress/dist',
// Cache directory
cacheDir: './.vitepress/cache',
// Clean URLs without .html extension (requires server support)
cleanUrls: true,
// Ignore dead links during build
ignoreDeadLinks: true,
// Or specific patterns:
ignoreDeadLinks: ['/playground', /^https?:\/\/localhost/],
// Get last updated timestamp from git
lastUpdated: true
})
```
## Route Rewrites
Map source paths to different output paths:
```ts
export default defineConfig({
rewrites: {
// Static mapping
'packages/pkg-a/src/index.md': 'pkg-a/index.md',
// Dynamic parameters
'packages/:pkg/src/:slug*': ':pkg/:slug*'
}
})
```
## Appearance (Dark Mode)
```ts
export default defineConfig({
appearance: true, // Enable toggle (default)
appearance: 'dark', // Dark by default
appearance: 'force-dark', // Always dark, no toggle
appearance: 'force-auto', // Always follow system preference
appearance: false // Disable dark mode
})
```
## Vite & Vue Configuration
```ts
export default defineConfig({
// Pass options to Vite
vite: {
plugins: [],
resolve: { alias: {} },
css: { preprocessorOptions: {} }
},
// Pass options to @vitejs/plugin-vue
vue: {
template: { compilerOptions: {} }
},
// Configure markdown-it
markdown: {
lineNumbers: true,
toc: { level: [1, 2, 3] },
math: true, // Requires markdown-it-mathjax3
container: {
tipLabel: 'TIP',
warningLabel: 'WARNING',
dangerLabel: 'DANGER'
}
}
})
```
## Build Hooks
```ts
export default defineConfig({
// Transform page data
transformPageData(pageData, { siteConfig }) {
pageData.frontmatter.head ??= []
pageData.frontmatter.head.push([
'meta', { name: 'og:title', content: pageData.title }
])
},
// Transform head before generating each page
async transformHead(context) {
return [['meta', { name: 'custom', content: context.page }]]
},
// After build completes
async buildEnd(siteConfig) {
// Generate sitemap, RSS, etc.
}
})
```
## Dynamic Config
For async configuration:
```ts
export default async () => {
const data = await fetch('https://api.example.com/data').then(r => r.json())
return defineConfig({
title: data.title,
themeConfig: {
sidebar: data.sidebar
}
})
}
```
## Key Points
- Config file supports `.js`, `.ts`, `.mjs`, `.mts` extensions
- Use `defineConfig` for TypeScript support
- `base` must start and end with `/` for sub-path deployments
- `srcDir` separates source files from project root
- Build hooks enable custom transformations and post-processing
<!--
Source references:
- https://vitepress.dev/reference/site-config
- https://vitepress.dev/guide/getting-started
-->