个人技术博客,记录 Linux、网络、云原生与系统设计等内容。
基于 Astro 7 + TypeScript + Markdown 构建,生成纯静态站点,通过 GitHub Actions 部署到 GitHub Pages。
- 随机名言首页(中国作者、外国作者各 50 条)、文章列表与分页
- 文章归档、标签索引与搜索
- Markdown 文章与代码语法高亮
- RSS、站点地图与页面 SEO 元信息
- 基于 giscus / GitHub Discussions 的文章评论
需要 Node.js 22.12.0 或更高版本及 npm;项目的 .nvmrc 使用 Node.js 22。
# 如果使用 nvm
nvm install
nvm use
# 安装依赖并启动开发服务器
npm ci
npm run dev默认访问 http://localhost:4321,实际地址以终端输出为准。
| 命令 | 说明 |
|---|---|
npm run dev |
启动开发服务器 |
npm run check |
运行 Astro 与 TypeScript 检查 |
npm run build |
构建静态站点,输出到 dist/ |
npm run preview |
本地预览构建产物,需先执行构建 |
.
├── .github/workflows/deploy.yml # GitHub Pages 构建与部署
├── astro.config.mjs # 站点地址、Markdown 与 sitemap 配置
├── public/
│ ├── fonts/ # 首页名言字体子集、许可证及维护说明
│ ├── img/ # 站点公共图片
│ └── posts/ # 文章图片及附件
├── src/
│ ├── components/ # 文章列表、分页等组件
│ ├── content/posts/ # Markdown 文章
│ ├── content.config.ts # 文章集合与元数据校验
│ ├── layouts/ # 页面公共布局
│ ├── lib/ # 文章工具与 Markdown 扩展
│ ├── pages/ # 页面路由、RSS 与搜索索引
│ └── styles/ # 全局样式
└── package.json
名言维护在 src/lib/quotes.ts,分为 chineseQuotes 和 foreignQuotes 两组,各 50 条。外国名言以中文译文展示,并记录出处及对应原文。刷新首页随机展示一条,避免连续出现相同内容。
首页默认使用自托管的霞鹜文楷子集,并提供朱雀仿宋对比:访问 /?font=wenkai 或 /?font=fangsong,两版会展示同一句名言。新增名言字符时,请按 public/fonts/README.md 更新字体。
在 src/content/posts/ 下创建 Markdown 文件,例如 hello-world.md:
---
title: "我的第一篇文章"
date: "2026-01-01T10:00"
tags: ["Linux", "随笔"]
description: "这篇文章的简短介绍。"
---
## 开始
在这里编写正文。元数据说明:
| 字段 | 必填 | 说明 |
|---|---|---|
title |
是 | 文章标题 |
date |
是 | 带引号的日期字符串,支持 YYYY-MM-DD、YYYY-MM-DDTHH:mm 或 YYYY-MM-DDTHH:mm:ss |
tags |
是 | 标签字符串数组,无标签时使用 [] |
description |
是 | 文章摘要 |
cover |
否 | 封面图片路径 |
文章按日期倒序排列。建议使用小写英文和连字符命名文件;上述文件对应的文章地址为 /posts/hello-world/。
将图片或附件放在 public/posts/hello-world/ 中,使用不带 public 前缀的路径引用:
发布前运行:
npm run check
npm run build文章页底部通过 src/components/Comments.astro 接入 giscus,评论保存在 leeweir/leeweir.github.io 仓库的 Announcements 分类。
- 使用 GitHub 账号登录后可评论;评论内容公开,无需自建后端、数据库或配置访问 token。
- 使用中文、浅色主题和懒加载,仅在文章页加载评论组件。
- 按文章路径关联讨论,并开启严格匹配。修改文章文件名或路径后,需要迁移原讨论的标题及 giscus 匹配哈希,否则会关联到新的讨论。
- 首次有人评论或回应时,giscus 自动创建对应讨论;评论可在 GitHub Discussions 中管理。
启用前,仓库必须公开并开启 Discussions,同时安装 giscus GitHub App,授权范围需包含该仓库。如果评论区提示 giscus is not installed on this repository,请在 GitHub 的 Settings → Applications → Installed GitHub Apps → giscus → Configure 中检查 Repository access 并保存。
更换评论仓库或分类时,在 giscus 配置页获取新的仓库和分类 ID,并更新 Comments.astro 中的 data-repo、data-repo-id、data-category 与 data-category-id。
仓库已配置 GitHub Pages 自动部署:
- 在 GitHub 仓库的 Settings → Pages → Build and deployment 中,将来源设为 GitHub Actions。
- 将代码推送到
master分支,或在 Actions 页面手动运行部署工作流。 - 工作流会依次安装依赖、检查代码、构建站点,并将
dist/发布到 GitHub Pages。
当前配置使用站点根路径。若更换域名,请更新 astro.config.mjs 中的 site 及 public/robots.txt 等相关地址。若部署到 /仓库名/ 子路径,还需配置 Astro 的 base,并调整页面及资源中的根路径链接。