Hexo 静态网站建设备忘录

使用 Hexo 静态网站生成框架和 NexT 主题构建简洁的静态博客,上传到对象存储或者静态网页空间就能立即投入使用,省去了托管主机的烦恼。同时,对象存储再搭配合适的内容分发网络,能优化网站投递性能。

网站架构

本站于 2021 年 1 月 5 日正式开通访问,类型为静态网站,目前网站架构方案如下:

  • 博客框架:Hexo 快速、简洁且高效的博客框架
  • 博客主题:NexT 优雅而容易扩展的 Hexo 主题
  • 博客风格:lei2rock/Blog 的博客样式进行调教
  • 博客构建:GitHub Actions 由 GitHub 提供的 CI 服务
  • 博客托管:GitHub Pages 和腾讯云对象存储
  • 博客域名:uuznn.cn 以博主的常用 ID 作为域名

Hexo 框架和插件

  • 框架本体:hexo
  • 资源压缩:hexo-all-minifier
  • 数学公式:hexo-filter-mathjax
  • 输出 RSS:hexo-generator-feed
  • 站点地图:hexo-generator-seo-friendly-sitemap

NexT 主题

  • NexT 主题:hexo-theme-next
  • 索引数据库:hexo-generator-searchdb
  • 自定义代码:通过 Custom Files 注入

持续集成

  • 第一阶段:使用 GitHub Actions 持续集成
    • 设置最新版 Node.js 环境
    • 使用 GitHub Pages action 自动部署
    • 推送构建产物到 公开仓库
    • 使用 Cloudflare Purge Cache 清除 CDN 缓存
  • 第二阶段:使用腾讯云 Coding CI 部署到 COS
    • 创建一个新的 CI 任务
    • 公开仓库的每一次提交都会触发 CI 克隆新内容
    • 使用 coscmd 推送网站到腾讯云对象存储
    • 使用 tccli 清除 CDN 缓存

这里其实可以用 GitHub Actions 直接推送腾讯在大陆的 COS 结点,但是由于北美的 GitHub 到中国大陆的网络质量问题,推送很缓慢。因此使用 Coding CI 的香港结点就规避了网络延迟问题。同时,Coding 是腾讯云的服务,所以直接使用腾讯云内网推送到 COS,速度超快!