Skip to content

Hugo 静态网站生成器使用指南

准备工作

安装 Hugo

Hugo Releases 下载对应的操作系统版本的 Hugo 安装文件

Mac 系统可以使用 Homebrew 进行安装:

bash
brew install hugo

安装完成后,在命令行中运行hugo,如果有输出,则表明安装成功。

下载并安装主题

hugo theme 挑选一个心仪的主题,比如我目前使用的是 Even 主题,找到主题的仓库地址,把主题 git clone 下来:

bash
git clone xxxxx.git

初始化本地站点

使用 Hugo,先在本地电脑上,进行内容的创作准备。

生成站点

使用 Hugo 快速生成站点,比如希望生成到 /path/to/site 路径:

bash
hugo new site /path/to/site

这样就在 /path/to/site 目录里生成了初始站点,进去目录:

bash
cd /path/to/site

站点目录结构如下:

bash
archetypes/
content/
layouts/
static/
config.toml

安装主题

将之前下载的主题,复制到 Hugo 生成目录下的themes目录中。

创建文章

bash
hugo new post/first.md

使用编辑器,打开 post/first.md,进行编辑。

预览效果

在你的站点根目录执行 Hugo 命令进行预览:

bash
hugo server --buildDrafts

浏览器里打开: http://localhost:1313 即可预览。

发布

创建仓库

在诸如 Github、Gitee、Coding.net 等支持 pages 服务的网站,创建仓库,并开启 pages 服务。

生成静态文件

bash
hugo

上述命令会按照安装的主题,生成静态文件。如果一切顺利,所有静态页面都会生成到 public 目录,如果有文章没有生成,请去掉文章头部的 draft=true 再重新生成。

推送

pubilc目录里所有文件 push 到刚创建的 Repository,开启pages服务,即可通过网络访问到内容。