使用 Hugo 创建静态网站
起步
Hugo 是用 Golang 开发的世界上最流行的静态网站生成器之一，安装方便，速度超快。上手也很容易，几条命令就可以新建一个带漂亮主题的网站。本文从初级用户角度来介绍 Hugo，会用能部署就行，写写博客并不需要对 Hugo 有太多了解。如果要自定义模版等高级用法，可以参考官方网站。
下面几条命令完成了安装、创建项目、添加第三方主题、创建一篇文章、本地启动服务。
# 安装
$ brew install hugo
# 创建新站点
$ hugo new site quickstart
# 添加主题，以 Ananke theme 为例
$ cd quickstart
$ git init
$ git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke
$ echo theme = \"ananke\" >> config.toml
# 创建第一篇文章
$ hugo new posts/my-first-post.md
# 本地启动服务
$ hugo server -D
目录
创建一个新站点，默认生成以下文件和目录
.
├── archetypes
│ └── default.md
├── config.toml
├── content
├── data
├── layouts
├── static
└── themes
- archetypes
使用 hugo new posts/my-first-post.md 新建文章时，每篇文章可能有一些通用的内容， 可以定义好模版文件，当执行 hugo new 时就去查找使用这些模版文件。默认的查找顺序如下，
archetypes/posts.mdarchetypes/default.mdthemes/my-xxx-theme/archetypes/posts.mdthemes/my-xxx-theme/archetypes/default.md
自动生成的 archetypes/default.md 内容如下
---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: true
---
如果我们执行 hugo new about.md ，将生成 ./content/about.md 文件，内容类似于
---
title: "About"
date: 2020-01-02T03:04:05-06:07
draft: true
---
- config.toml
配置文件，定义站点的变量，这些变量可以在其他文件中引用
baseURL = "http://example.org/"
languageCode = "en-us"
title = "My Portfolio"
......
-
content
文章保存在这个目录
-
data
存放 YAML/JSON/TOML 这 3 种格式的配置文件
-
layouts
存放
.html格式的模版文件，用于定义网站外观。默认的layouts/index.html如下<!DOCTYPE html> <html lang="en-US"> <head> <meta charset="utf-8"> <title>{{ .Site.Title }}</title> </head> <body> <h1>{{ .Site.Title}}</h1> {{ .Content }} </body> </html> -
static
存放站点的 images/CSS/JavaScript 等静态文件
-
themes
使用第三方主题时，放置在该目录
本地运行
在项目目录下执行 hugo 命令，可以看到类似下面的输出
| EN
-------------------+-----
Pages | 4
Paginator pages | 0
Non-page files | 0
Static files | 0
Processed images | 0
Aliases | 0
Sitemaps | 1
Cleaned | 0
Total in 18 ms
hugo 命令在 public 目录下生成整个静态站点，可以执行 hugo server -D 在本地启动服务，访问地址为 http://localhost:1313/。
部署到 Github pages
Hugo 官方文档提供了使用 Github Action 部署的方式，我觉得太麻烦。既然本地把整个站点都生成好了，应该 git push 就能完成部署才对。详细过程大家可以参考 How to Set Up a Hugo Site on Github Pages - with Git Submodules!，写得非常详细了，重点就是使用 Git Submodules，把生成的 Public 静态站点文件和主题这两者作为 Hugo 项目的 submodules。