macOS 系统中安装Hugo,建立一个全新站点。 您需要macos系统, 初步了解bash, Git

本快速开始例子中使用 macOS 操作系统.

在Windows操作系统中安装Hugo的指令,请参考windows安装Hugo

运行本教程前建议您已经安装Git工具

其他途径,比如Hugo相关书籍和教程视频请见外部学习资源

如果在墙外,可以看见内嵌YouTube上教学视频!

第一步: 安装 Hugo

macOS操作系统的的包管理工具HomebrewMacPorts, 可以相应的从brew.sh 或者 macports.org安装。

在Windows操作系统中安装Hugo的指令,请参考windows安装Hugo

1
2
3
brew install hugo
# 或者
port install hugo

运行如下命令验证安装:

1
hugo version

第二步: 建新站点

1
hugo new site quickstart

上面命令会创建一个新目录quickstart, 并在其内创建了新的Hugo站点

第三步: 添加Theme主题

主题列表 内有许多主题可以考量. 这里使用的是漂亮的 Ananke 主题.

首先从Github下载主题文件并添加在新建站点的themes目录中:

1
2
3
cd quickstart
git init
git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke

不使用git的用户:

然后,在站点配置文件中添加主题设置:

1
echo theme = \"ananke\" >> config.toml

第四步: 添加内容

可以选择手工创建内容文件(比如 content/<CATEGORY>/<FILE>.<FORMAT>)并在文件中添加元数据(metadata), 不过hugo有更好的方式,能够使用new命令来为您做一些事情(比如添加标题和日期):

1
hugo new posts/my-first-post.md

有需要的话可以编辑新建的文件内容,它的开头部分是类似这样的:

1
2
3
4
5
6
---
title: "My First Post"
date: 2019-03-26T08:47:11+01:00
draft: true
---

草稿不会被编译部署;当编辑好草稿时,更新文件头部的
草稿状态为draft: false. 更多信息见 这里.

第五步: 启动Hugo服务器

现在,启动服务器了, 这里(译注: 使用命令行参数 -D)启用了草稿:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
▶ hugo server -D

                   | EN
+------------------+----+
  Pages            | 10
  Paginator pages  |  0
  Non-page files   |  0
  Static files     |  3
  Processed images |  0
  Aliases          |  1
  Sitemaps         |  1
  Cleaned          |  0

Total in 11 ms
Watching for changes in /Users/bep/quickstart/{content,data,layouts,static,themes}
Watching for config changes in /Users/bep/quickstart/config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

浏览器里导航到http://localhost:1313/查看您的新站点.

随意编辑或者添加新内容,然后简单的刷新浏览器可以很快看见内容的变化(可能需要强制刷新浏览器,类似Ctrl-R的快捷键一般会起作用).

第六步: 自定义主题

新站点看起来已经很不错了,现在您想在公开发布站点前对其做些小调整

站点配置

在文本编辑器中打开 config.toml 文件:

1
2
3
4
baseURL = "https://example.org/"
languageCode = "en-us"
title = "My New Hugo Site"
theme = "ananke"

title 替换为一段更符合您站点的文本。同时,如果您已经拥有了域名, 请修改 baseURL 为您的域名. 注意这个域名设置值在运行本地开发机器时并不起作用。

提示: 尝试在服务器运行时对站点配置文件或者站点的其他文件做些修改,在浏览器上会马上看见这些变化,或许您可能需要 清空缓存.

关于ananke主题的配置选项, 请参考ananke主题站点.

更多主题配置信息,参见定制主题.

第七部: 编译站点静态页面

很轻松, 调用下面命令:

1
hugo -D

编译输出的默认目录是 ./public/(使用命令行参数-d/--destination可以更改输出目录, 或者在配置文件中设置 publishdir 来设置)