使用 VitePress 构建生成的博客网站。
pnpm install# 启动开发服务器
pnpm run dev
# 构建生产环境站点
pnpm run build
# 本地预览生产版本
pnpm run preview在 VitePress 基础上，本项目扩展了如下功能。
| 扩展 | 语法 | 说明 |
|---|---|---|
| 马克笔 | ==text== / ==text{.class}== | 高亮标记，支持 info/note 等主题色 |
| 隐秘文本 | !!text!! | 鼠标悬浮才可见 |
| 上/下标 | ^text^ / ~text~ | 上/下角标 |
| 任务列表 | - [ ] task | GFM 任务列表 |
| 额外容器 | ::: note / ::: important / ::: caution | VitePress 未内置的三种容器 |
| 数学公式 | $...$ / $$...$$ | LaTeX 数学方程 |
| 代码块图标 | 代码组自动匹配语言图标 | 基于 vitepress-plugin-group-icons |
| 代码块中词高亮 | // [!code word:xxx] | 基于 Shiki transformer |
| 路由 | 组件 | 功能 |
|---|---|---|
/ | Home.vue | 侧边栏（统计/分类/标签）+ 文章列表 |
/archives | Archives.vue | 按年份归档 |
/skills | Skills.vue | 技术栈、开发工具、项目展示 |
/games | Games.vue | Steam 游戏展示 |
/anime | Anime.vue | 追番列表 |
/song-list | SongList.vue | 歌单展示 |
/friends | Friends.vue | 友链卡片网格 |
- 面包屑导航 (
Breadcrumb.vue) — 注入doc-before，根据目录结构自动生成 - 版权信息 (
Copyright.vue) — 注入doc-footer-before，支持 CC0 ~ CC-BY-NC-ND 七种协议，支持原创/转载声明，完整的前置声明配置 - 上下页 (
PrevNext.vue) — 注入doc-after，按创建时间顺序导航，覆盖默认的基于侧边栏结构导航 - 评论区 (
Comment.vue) — 注入doc-after，集成 Waline，含多套表情包 + 文章反应 + 浏览量统计
ArticleMeta— 每篇文章标题下侧显示更新日期、字数统计、阅读时间、分类、标签、Waline 浏览量BackToTop— 回到顶部按钮，附带圆形阅读进度指示器
| 组件 | 功能 |
|---|---|
Icon | Iconify 图标通用封装 |
GitHubCard | GitHub 仓库卡片 |
Bilibili | Bilibili 视频嵌入 |
GitHubContributionGraph | GitHub 贡献图表 |
posts.data.ts— 文章数据加载器，聚合 Git 日志时间戳、按分类/标签/年份分组，支持置顶排序autoFrontmatter.ts— 开发模式下用chokidar监听新 md 文件，自动填充title和createTime- 统一配置 (
theme/config) — 集中的配置模块，管理版权信息、面包屑路径映射、社交链接、分页参数、博客起始日期等
- RSS Feed — 构建时自动生成
rss.xml，含最新 100 篇文章 - Open Graph / Twitter Card — 每页自动生成
og:title、og:description、og:image、twitter:card等标签 - 结构化标签 — 文章页自动生成
article:published_time、article:tag等 - 封面图策略 — frontmatter
cover→ 正文首图 →/avatar.png兜底
- 图片预览 — 集成 Fancybox，图片可点击放大/缩放/旋转，自动绑定/销毁
- 目录自动居中 — 大纲滚动时自动将激活项滚动到可视区域中间
- 自动更新 URL 锚点 - 页面滚动时自动更新 URL 锚点
- 暗黑模式过渡 — View Transitions API + 圆形 clipPath 扩散动画
- IndexNow 推送 —
scripts/push-indexnow.js，构建后自动向搜索引擎推送链接 - Git 提交历史 — 集成
@nolebase/vitepress-plugin-git-changelog，文章底部显示 Git 变更记录 - 环境变量注入 — 自动将所有
VITE_开头的环境变量暴露给 Vue 组件
完整的 VitePress 中文翻译。
项目代码采用 MIT 许可协议，原创文章采用 CC-BY-SA-4.0 许可协议