技术

项目概览 这个站点采用 Hugo 静态生成 + PaperMod 主题 + Cloudflare Pages 免费部署 的技术栈，从域名注册到上线只用了一个下午。本文逐层拆解架构设计和自定义魔改。 技术选型 层级 技术 理由 静态生成 Hugo v0.164 Go 实现，构建 200ms，单二进制 主题 PaperMod 响应式、内置搜索/暗色模式/SEO 托管 Cloudflare Pages 免费、全球 CDN、push 即部署 域名 luostratus.cn 腾讯云注册 → Cloudflare DNS 接管 代码托管 GitHub 免备案最优解 .cn 域名托管在境外服务器无需 ICP 备案，这是选择 Cloudflare Pages 的关键原因。 项目结构 luostratus.cn/ ├── hugo.yaml # 站点配置 ├── archetypes/ │ ├── default.md # 普通文章模板 │ └── gallery.md # 画廊模板 ├── content/ │ ├── about.md │ ├── posts/ # 博客文章 │ └── gallery/ │ ├── _index.md # 画廊主页（branch bundle） │ └── *.png / *.jpg # 图片资源（bundle 成员） └── layouts/ ├── gallery/ │ ├── list.html # ★ 画廊核心：排序 + 瀑布流 │ └── single.html # 画廊详情 └── partials/ ├── extend_head.html # 全站 CSS + 动效 └── extend_footer.html # 返回顶部 + 导航 JS PaperMod 提供 extend_head 和 extend_footer 扩展点，覆盖这两个 partial 即可注入自定义样式与脚本，不修改主题一行代码，升级主题零冲突。 ...