Hugo 是最流行的静态站点生成器之一。
安装
我这里使用的是 Windows 平台,安装版本为 hugo_0.125.4_windows-amd64.zip。下载的压缩包中有一个名为 hugo.exe 的文件,可以使用 PowerShell 进入其所在目录执行,也可以把它添加到环境变量。
执行 hugo version
,看到类似的输出则代表安装成功。
PS C:\> hugo version
hugo v0.125.4-cc3574ef4f41fccbe88d9443ed066eb10867ada2 windows/amd64 BuildDate=2024-04-25T13:27:26Z VendorInfo=gohugoio
macOS
用户可以使用包管理器 Homebrew
进行安装。
brew install hugo
创建网站
hugo new site myblog
生成的 myblog 目录结构如下:
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2024/4/28 23:43 archetypes
d----- 2024/4/28 23:43 assets
d----- 2024/4/28 23:43 content
d----- 2024/4/28 23:43 data
d----- 2024/4/28 23:43 i18n
d----- 2024/4/28 23:43 layouts
d----- 2024/4/28 23:43 static
d----- 2024/4/28 23:43 themes
-a---- 2024/4/28 23:43 83 hugo.toml
安装主题
可以到 Hugo 官方的主题商店选择自己心仪的主题。这里以Archie - Hugo theme为例演示:
mkdir themes
cd themes
git clone https://github.com/athul/archie.git
然后在网站根目录的 hugo.toml
中增加 theme="archie"
。
启动博客
hugo server --buildDrafts
如果没有在 hugo.toml
中配置主题,也可以在启动时用 -t
指定:
hugo server -t archie --buildDrafts
新建文章
hugo new post/post.md
执行后,content/post
目录会生成 post.md
。在post.md
中填写内容后,再次执行 hugo server --buildDrafts
,即可看到文章已经成功生成。
部署到 Github
首先创建一个新仓库,仓库名一定要是你的Github用户名.github.io
。
仓库创建完成后,再使用下面的命令生成网站。我这里用的 baseURL
是自己的项目地址,大家在部署时需要替换成自己的。
hugo --theme=archie --baseURL="https://lbzzyz.github.io/" --buildDrafts
上述命令执行完成后,会在网站根目录生成一个 public
文件夹,这就是网站的最终产物。
接下来,我们需要把 public 文件夹上传到 Github 仓库,以便用 Github 访问。
cd public
git init
git add .
git commit -m "Hugo init"
git remote add origin https://github.com/LBZZYZ/lbzzyz.github.io.git
git push -u origin master
网站产物已经推送到刚才创建的 Github 仓库,此时我们访问 https://lbzzyz.github.io,即可看到看到网站内容了。
笔记与博客独立管理
我希望笔记可以使用纯 Markdown
格式保存,并且与 Hugo
等第三方框架产生的文件独立管理。因此这里使用 Git 的子模块实现。
git submodule add https://github.com/LBZZYZ/WorkNotes.git content/post
git add .
git commit -m 'add submodule'
git push
这条命令可以为当前项目添加一个子模块,最后的 content/post
参数是制定项目克隆到哪里,缺省时代表克隆到当前目录。由于 archie
主题的博客文件都是放到 content/post
中,因此我们制定把笔记克隆到这里。
由于引入了子模块,在拉取仓库代码时需要加入 --recursive
关键字,即 git clone --recursive your-repo.git
。针对已经拉取到本地的代码,也可以执行下面的步骤同步子模块:
- 初始化本地子模块配置文件:
git submodule init
; - 更新项目,抓取子模块内容:
git submodule update --remote
。
也可以将这两步命令合并为一步:git submodule update --init --remote
。