📺 视频教程

精选优质视频教程，助你快速上手 VitePress 开发。

---

🎯 入门系列

VitePress 快速入门

VitePress 快速入门教程

从零开始学习 VitePress，30分钟快速上手

📺 B站⏱️ 约30分钟👥 10万+观看

📖 章节导航：00:00 介绍03:15 安装配置08:30 项目结构15:00 基础配置22:00 本地预览27:30 总结

VitePress 基础配置

VitePress 配置详解

深入了解 VitePress 配置文件，掌握各种配置选项

📺 B站⏱️ 约45分钟

📖 章节导航：00:00 配置文件概述05:20 站点配置12:45 主题配置20:30 导航与侧边栏30:00 Markdown 配置38:15 构建配置

---

🚀 进阶系列

自定义主题开发

Build a Custom VitePress Theme

Learn how to create custom themes for VitePress from scratch

📺 YouTube⏱️ About 1 hour👥 English

📖 Chapters:00:00 Introduction08:30 Theme Structure18:00 Layout Components32:15 Custom Styles45:00 Slots & Extensions55:00 Deployment

博客搭建实战

用 VitePress 搭建个人博客

从零搭建一个功能完整的个人博客网站

📺 B站⏱️ 约1小时

📖 章节导航：00:00 项目初始化10:30 博客列表页25:00 文章详情页35:45 标签分类45:20 评论系统55:00 部署上线

---

📦 实战项目

组件库文档站点

搭建组件库文档站点

学习如何为 Vue 组件库搭建专业的文档站点

📺 B站⏱️ 约2小时🎯 实战项目

📖 章节导航：00:00 项目规划15:30 组件演示容器35:00 API 文档生成55:00 搜索集成75:30 多语言支持95:00 自动部署

部署与自动化

VitePress 部署指南

学习如何将 VitePress 站点部署到各大平台

📺 B站⏱️ 约40分钟

📖 章节导航：00:00 部署概述06:15 GitHub Pages15:30 Vercel 部署24:00 Netlify 部署32:45 自定义域名38:00 CI/CD 自动化

---

🌐 英文资源

Official VitePress Tutorial

VitePress Crash Course

Complete VitePress tutorial from installation to deployment

📺 YouTube⏱️ About 45 minutes👥 English

📖 Chapters:00:00 What is VitePress05:30 Installation12:00 Configuration22:15 Customization32:00 Build & Deploy40:00 Summary

---

📚 推荐频道

🎬

Vue.js 官方

Vue.js 及生态官方频道

🎬

Vue Mastery

Vue.js 学习资源平台

🎬

Evan You

Vue.js & Vite 作者

---

📝 配套文字教程

每个视频都配有对应的文字教程和完整代码，方便你边看视频边参考。

入门系列配套

视频教程	文字教程	完整代码
VitePress 快速入门	5 分钟快速上手	示例仓库
VitePress 配置详解	配置文件详解	—

进阶系列配套

视频教程	文字教程	完整代码
自定义主题开发	自定义主题	主题开发实战
博客搭建实战	博客搭建实战	多作者博客

实战项目配套

视频教程	文字教程	完整代码
组件库文档站点	组件库文档	Monorepo 管理
部署与自动化	部署与发布	CI/CD 配置

---

🛠 视频代码仓库

# 克隆配套代码仓库
git clone https://cnb.cool/ZhangWeilong/VitePress.git

# 选择对应章节
cd VitePress/docs/examples

# 安装依赖并运行
npm install
npm run dev

---

💡 学习建议

视频资源说明

以上视频资源来自网络，版权归原作者所有。如遇链接失效，欢迎在项目仓库提交 Issue 反馈。

视频学习技巧

1. 边看边练：跟着视频同步操作，加深理解
2. 参考文字：视频 + 文字教程结合，理解更深入
3. 运行代码：下载配套代码，本地运行调试
4. 做好笔记：记录关键知识点和踩坑点
5. 举一反三：尝试修改代码，探索更多可能
6. 及时复习：看完视频后及时回顾巩固

---

🗺 学习路线图

推荐按以下顺序学习：

graph TD
  A[快速入门] --> B[基础配置]
  B --> C[主题定制]
  C --> D[博客搭建]
  D --> E[组件文档]
  E --> F[部署上线]
  
  style A fill:#e8f5e9
  style F fill:#fff3e0

阶段	视频	预计时间	目标
入门	快速入门 + 配置详解	1-2 天	能独立搭建基础站点
进阶	主题开发 + 博客搭建	3-5 天	掌握自定义主题和博客
实战	组件文档 + 部署	5-7 天	完成完整项目并部署