VitePress：基于 Vite 的静态站点生成器

vuejs 团队开源的 VitePress，目前已在 GitHub 收获 17,970 个 Star：

VitePress 是一个基于 Vue 的静态站点生成器，是 VuePress 的精神继承者，构建在 Vite 之上。

它结合了 Vue 的组件能力与 Vite 的快速构建特性，适合用于文档站点、技术博客以及小型项目的展示页面。

早期写文档多用 VuePress，但随着项目体积增长，冷启动和热更新速度成为痛点。VitePress 用 Vite 替换 webpack，开发体验有明显改善，启动和热更新几乎做到毫秒级响应。

VitePress 内置支持 Markdown 扩展语法，可以在 Markdown 中直接使用 Vue 组件，也可以使用 Vue 的模板语法、计算属性、自定义指令等能力。

文档

VitePress 的官方文档地址是 vitepress.dev，里面包含从入门到进阶的完整教程，包括配置、部署、主题定制、组件使用以及常见问题的解决方案。

主要特性

VitePress 内置的功能覆盖了文档站点常见的几类需求：

• **Markdown 扩展：**支持表格、任务列表、数学公式、代码块语法高亮、代码组切换、行高亮等
• **Vue 支持：**可以在 Markdown 中直接使用 Vue 组件，支持单文件组件以及自动导入组件
• **主题定制：**默认主题提供导航栏、侧边栏、搜索、深色模式、i18n 国际化等开箱即用功能，也可以完全自定义主题
• **构建优化：**基于 Vite 的构建链路，支持按需加载、自动压缩资源、PWA 等特性
• **SEO 友好：**生成静态 HTML，自带 sitemap、robots.txt 等配置项

使用方式

VitePress 的安装方式比较简单，通过 npm 或 yarn 添加依赖即可：

npmadd-Dvitepress

初始化项目目录结构：

. ├─ docs │ ├─ index.md │ ├─ guide │ │ └─ getting-started.md │ └─ .vitepress │ └─ config.ts └─ package.json

在 package.json 中添加几个脚本命令：

{"scripts":{"docs:dev":"vitepress dev docs","docs:build":"vitepress build docs","docs:preview":"vitepress preview docs"}}

本地启动开发服务器：

npmrun docs:dev

构建生产版本：

npmrun docs:build

构建产物默认输出到 docs/.vitepress/dist 目录，可以直接部署到 Vercel、Netlify、GitHub Pages 或任意静态文件托管服务。

配置

VitePress 的配置文件位于 docs/.vitepress/config.ts（或 config.js），常见的配置项包括站点标题、描述、主题配置、head 注入、markdown 配置等：

import{defineConfig}from'vitepress'exportdefaultdefineConfig({title:'My Docs',description:'项目文档',themeConfig:{nav:[{text:'指南',link:'/guide/getting-started'}],sidebar:[{text:'指南',items:[{text:'快速开始',link:'/guide/getting-started'}]}]}})

生态支持

VitePress 由 VoidZero 团队提供长期支持，构建链路依赖于 Vite、Vitest、Rolldown 和 Oxc 等高性能 JavaScript 工具链。

StackBlitz 为 VitePress 提供了在线 Playground 支持，pull request 可以生成即时预览链接，方便协作评审。

Algolia 为 VitePress 提供了 DocSearch 能力，文档站点接入后可实现快速全文检索。

BrowserStack 提供跨浏览器和真实设备的测试基础设施，用于保障 VitePress 在各浏览器中的表现一致性。

适用场景

VitePress 适合以下几类使用场景：

• 开源项目或产品文档站点
• 个人技术博客
• 团队内部知识库
• 简单的产品落地页

如果项目对 SSR、动态路由、用户系统有较重需求，VitePress 不一定合适，这类场景可以考虑 Nuxt 或其他 SSR 框架。

协议

VitePress 以 MIT 协议开源，由 Yuxi (Evan) You 自 2019 年起持续维护，可以自由用于商业或个人项目。

有较重需求，VitePress 不一定合适，这类场景可以考虑 Nuxt 或其他 SSR 框架。

协议

VitePress 以 MIT 协议开源，由 Yuxi (Evan) You 自 2019 年起持续维护，可以自由用于商业或个人项目。