部署个人主页(Astro)

最近把个人主页重新整理了一下。主题模板用的是 idealclover/Homepage，整体是 Astro + Tailwind 的静态主页，很适合做一个轻量入口页：放头像、博客入口、联系方式，再加一点最近文章就够用了。

大致步骤很简单。先把模板 clone 到本地，改 src/data/info.ts 里的个人信息、链接和卡片内容；再检查 public 里的图标、字体、图片资源；最后本地预览，确认布局在桌面和手机上都不乱。

常用命令就这几个：

1
pnpm install
2
pnpm dev
3
pnpm build

我一开始沿用了模板里的 Yarn，后来改成了 pnpm。主要原因是自己的博客项目也在用 pnpm，两个项目统一后锁文件和 CI 配置更清楚，也避免 Cloudflare 构建时自动切 Yarn 版本导致 lockfile 被修改。改完后记得删掉旧的 yarn.lock，提交 pnpm-lock.yaml，并在 package.json 里写好 packageManager。

部署上我没有用传统静态托管，而是走 Cloudflare Workers Static Assets。这样主页本身是静态资源，遇到需要后端处理的小功能时，也能在 Worker 里补一点逻辑。比如最近文章卡片需要读取博客 RSS，但浏览器直接跨域请求会被 CORS 拦住，所以我让主页 Worker 通过 Service Binding 去调用博客 Worker，再把 RSS 结果返回给前端。

这次踩的坑主要有几个：模板里残留了原作者的资源域名，构建后 CSS、字体或 favicon 可能还指向旧地址；Cloudflare 构建命令和包管理器要和本地一致；如果从 Yarn 换到 pnpm，lockfile 一定要同步提交；另外 RSS 这种跨域内容，最好不要让浏览器硬拉，放到 Worker 里处理更稳。

折腾完以后，这个主页就变成了一个比较干净的个人入口：打开快，维护简单，后面想加一点小功能也不至于推倒重来。