↓跳到主要内容
  1. Posts/

维护日志｜No.3：Hugo 博客搭建流程简要记录

终于把正式版写出来了！时隔一周，回首望，恍如隔世……

·· 2161 字·5 分钟
运营公告 博客装修
目录

前言 #

原来博客搭建已经一周了……（恍惚）从仅仅把博客搭起来，到现在折腾的那些东西，这一周发生了太多，我走出了太远……真是恍如隔世啊！

我上周明明信誓旦旦说搭完就先不搞了的来着，但就是忍不住我这手啊……！一周发了五篇博文，四篇半在记录搭博客的折腾，恐怖如斯！！！真的整整一周都在搞博客吧！！！发狠了，忘情了，没命了……太可怕了！！！

怎么说，不愧是实践出真知，我觉得我就是写完了五月月记开始对折腾博客上手的，于是马不停蹄地又开始折腾 About 和友链了。阿弥陀佛，转移完 Notion 上的文章再搭好评论区就真的真的歇一段时间不折腾了！剩下的都是细枝末节，有空慢慢来……目标是等八月回了英国再说，挂梯子问 ChatGPT 太卡了，不方便。

搭搭 #

看我记录搭建过程的毛象，五月底就开始折腾了。不想在 C 盘里下载一堆东西，就打算在 WSL 上搭，都快一年没打开 Ubuntu 了我早已忘了个精光，结果出师不利 Ubuntu 无法访问，VSCode 也在报错但靠卸载重装治好了。WSL 这边基本也是用重置解决了问题，然后要在 WSL 上下载 Hugo，事情变得很复杂，搞不来最终还是放弃了，转而直接在 Windows 系统里下载了 Go，Git 和 Hugo 三件套。原本以为用 Windows 会很烦的，事实证明只是不熟悉没上手，现在打开 Git Bash 一切就像回家一样……总之hugo version确认成功后结束了初始的折腾，放话说我累了但一周后我又好了伤疤忘了痛地开始了……

我搭博客找的参考是塔塔的经典作业，但有两件事绊住了我。第一新建 GitHub repo 的时候说要遵循“github 账号名.github.io”的格式，我不想这样给我的 repo 命名，觉得应该不是非得这样，但又不知所措，于是白白纠结拖延了很久。第二 SSH 密钥我完全没用过，看起来好复杂弄不明白什么情况。所以按照官方文档里写的把三件套下载完就卡住了。

事实上 repo 应该不必按照上述格式命名。我思考了一下想到“github.io”大概是用 GitHub Pages 托管的网页的后缀，确认了一下我之前用 GitHub Pages 托管的页面，repo 名字是 ABC，网址是https://我的 GitHub 账号名.github.io/ABC/的格式。但我打算用 Netlify 托管，且我记得 Netlify 是可以自定义域名的，之前用 Netlify 托管的 repo 也是起了自己想起的名字，遂大胆地新建 repo 自由取名，比对着官方的 Quickstart 和我选择的主题 Congo 的文档开始搭建。

我选择的是使用 Git 安装，挺方便的很快就搭好了，因为下一步就是配置 baseURL，就干脆先托管上了 Netlify，结果后来发现不太对。忘记具体是什么情形了，大概是说明里写的要在某某文件做某某改动，但我死活找不到存放的文件夹，感觉少了东西。可能是hugo new site时候出了什么问题吧。

遂把 GitHub repo 和本地博客文件夹全删了重新搭。这下顺利地一搭到底了，看见博客文件夹里多出了一大堆东西才确认之前是真的有问题……（）以及先前那个 SSH 密钥的问题，因为写的说明太多了我看不进去就没认真看（），原来就是把本地的文件夹和 GitHub repo 连接起来，让本地的代码能上传到 repo 里去。这下我想起来了.jpg，一切记忆都复苏了！这个也可以通过复制 url 解决，新建 GitHub repo 的时候会提供详细的说明，照办就行。

当时折腾得我特别内耗，可参考的资源多却散乱，没有一个完全适配我的需求。搜托管教程搜出来都是自己有域名的，但我当时只是想确认 Netlify 究竟能不能自定义域名，却找不到一个确认的信息来源。这种琐碎的细节还有很多，现在回过头一看也都记不清楚了，写下来的时候不知道省略了多少已经忘掉的蹉跎消磨，只剩云淡风轻……事情明明挺简单的啊，但偏偏自己从“无知”走到“知”这个摸索的阶段就是如此费时费力费心情，哎！

最后终于发出一篇 测试博文，原想就此打住，结果又叮呤哐啷折腾了半响，这个就是后话（前话）了……

后语 #

还是总结一下搭建历程，或许能给别人提供些参考吧。

操作系统：Windows 10
托管平台：Netlify

  1. 安装：参考官方文档，下载 Git、Go 和 Hugo extended 版。
    • Hugo 不下载 extended 版本的话还需要下载 Dart Sass 以确保 Sass 能正常使用。
    • 配置环境变量一步可参考塔塔的教程
  2. 启动：参考官方文档，在 Git Bash 中输入hugo version确认已安装 Hugo 后开始建站。下列代码综合了 Hugo 官方和我使用的主题 Congo 的文档，能够在本地搭建起一个最基础的博客站点。
hugo new site quickstart # quickstart改为自定义的博客文件夹的名字
cd quickstart # 进入博客文件夹根目录
git init # 将博客文件夹初始化为 Git repo
git submodule add -b stable https://github.com/jpanther/congo.git themes/congo # 参考主题文档，安装博客主题，我选择的是 Congo
echo "theme = 'congo'" >> hugo.toml # 向 hugo.toml 添加主题配置
hugo server # 启动本地渲染，预览博客

  1. 运行：后续撰写博文、添加配置等操作可参考官方文档，或主题自己的文档。以 Congo 为例，事实上我没有进行上述代码里echo "theme = 'congo'" >> hugo.toml这一步，配置全是参考 Congo 的文档进行的，实在写得非常详细，帮大忙了……

  2. 连接：在 GitHub 上创建一个新 repository，自由命名。按照页面指示，在 Git Bash 里输入代码，将本地的博客文件夹和刚刚创建的 repository 连接起来。示例代码如下，仅供参考。

git remote add origin https://github.com/username/test.git # 网址即为你的 GitHub repo 的 url
git push -u origin main
  1. 提交：为将本地对博客的改动同步更新到 GitHub repo 上，每次在本地修改完成后，都需要进行如下操作。
git add . # 添加本地的所有改动
git commit -m "commit message" # 提交本地的所有改动，并在双引号内附上说明
git push origin main # 将本地改动同步至 GitHub repo；main 也可能是 master，需在 GitHub repo 自行确认 branch 的命名
  1. 托管：我选择的平台是 Netlify，这部分操作比较无脑，参考官方文档即可。完成这一步后，博客就正式上线啦！
↑