Build documentation sites from Markdown with VitePress, then configure navigation, search, and themes. The skill also covers embedding Vue components, organizing multilingual content, and preparing deployment settings for supported hosting platforms.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
VitePress static site generator powered by Vite and Vue. Use when building documentation sites, configuring themes, or writing Markdown with Vue components.
설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.
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:
.md filesBefore working with VitePress projects:
.vitepress/config.ts for site configuration.vitepress/theme/ for custom theme extensionspublic/ directory contains static assets served as-isThe 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<ThemeConfig>. 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.
| 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 |
| 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 |
| 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 |
| Topic | Description | Reference |
|---|---|---|
| Internationalization | Multi-language sites, locale configuration | advanced-i18n |
| SSR Compatibility | Server-side rendering, ClientOnly, dynamic imports | advanced-ssr |
| Topic | Description | Reference |
|---|---|---|
| Deployment | GitHub Pages, Netlify, Vercel, Cloudflare, Nginx | recipes-deploy |
아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.
로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.
Set up JavaScript and TypeScript projects using Anthony Fu’s conventions for code organization, development tools, and package publishing. Establish shared checks for formatting, types, unused code, and tests before committing changes.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Create a GitHub pull request from the current branch with a structured title, a clear explanation of behavior changes, and recorded check results. For UI changes, attach before-and-after screenshots so reviewers can assess the visual differences.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Build and configure web servers with Nitro, including request handlers, caching, storage, and scheduled tasks. The skill also guides deployment to supported runtimes and platforms, plus migration from Nitro v2 to v3.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Develop Vue web applications with Nuxt, covering pages, data fetching, shared state, and server API routes. Configure rendering on the server or in the browser, and prepare deployment settings for supported platforms.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Organize shared data and update logic in Vue apps using Pinia stores, containers for application state. The skill guides store definitions, reactive data access, communication between stores, testing, and integration with Nuxt and server-side rendering.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Manage Node.js dependencies with pnpm, from installing packages to coordinating multiple projects in one workspace. The skill covers shared version settings, third-party package patches, dependency overrides, and consistent installation procedures for automated build environments.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.