使用 Hugo 在 GitHub 上搭建博客

主题概况

Hugo 是一个用 Go 语言编写的静态网站生成器。类似的静态网站生成器还有Jekyll、hexo 等等。以上生成器都使用过，但感觉要么环境麻烦，要么生成静态页面步骤繁琐以及生成缓慢。如果你正想在 GitHub 上搭建个静态的博客，搜索一大堆都是关于 Jekyll 和 hexo 的相关文章，使用 Hugo 的相关文章却很少，但是我认为使用 Hugo 方便一点。本着学习分享的原则，下面整理下如何使用 Hugo 。

Hugo 官方主页：https://gohugo.io/

安装指南

安装Hugo

在 Hugo Releases 上下载最新版的 Release 程序。没错，下下来就是一个二进制的程序。

配置环境

本例以 Widows 为例设置 Hugo 运行环境变量，如需更详细的 Windows/macOSX 的步骤说明，请移步至官网：

Installation on OS X

Installation on Windows

在本地电脑上建立以下文件目录：(文件路径随意)

D:\Hugo\bin\hugo.exe

D:\Hugo\Sites

我已将下载下来的 Hugo 二进制程序重命名为 hugo.exe 并放进 bin 文件夹内了。

设置 Windows 系统环境变量，我的电脑右键–>属性–>高级系统设置–>在"高级"标签页中–>环境变量…，选中 PATH 变量，并编辑…，在编辑值中新添加 hugo 程序的路径即可，一张图说明：

运行

安装并配置Hugo环境后，打开cmd命令行，可以直接使用hugo命令了。

• Git
• Go 1.5+
• govendor

查看 Hugo 版本

hugo version

创建本地网站

生成站点

之前创建的 Sites 就是用来存放创建的网站的，切换到 Sites 目录，创建文件夹名为 blog 的网站：

hugo new site blog

创建的站点文件目录说明：

|- archetypes ：存放default.md，头文件格式

|- content ：content目录存放博客文章（.markdown/.md文件）

|- data ：存放自定义模版，导入的toml文件（或json，yaml）

|- layouts ：layouts目录存放的是网站的模板文件

|- static ：static目录存放js/css/img等静态资源

|- config.toml ：config.toml是网站的配置文件

当前网站是没有任何内容的，需要下载个主题跑起来才有内容。

安装主题

这里暂时不使用 git 命令 clone 下载主题，我们通过手动下载方式进行下载。

Hugo官方主题：https://themes.gohugo.io/

Hugo官方主题GitHub：https://github.com/spf13/hugoThemes/

这里选取Hyde主题为例，克隆下来

cd themes
git clone https://github.com/spf13/hyde.git

包含以下文件：

|- archetypes ：存放default.md，头文件格式

|- layouts ：主题模板文件

|- static ：静态资源

|- theme.toml ：主题配置文件

运行Hugo Server

Hugo 内置 http server，在你的站点根目录执行 hugo server 命令，即可在浏览器里输入： http://localhost:1313 访问网站。

hugo server --theme=hyde

（注明：需要指定主题，如果在 config.toml 中配置指定主题可以省略 --theme 参数）

发表文章

可以看到现在博客里没有文章，使用 hugo new 命令创建文章。

hugo new post/test.md

可以用文本文件或 Markdown 编辑器打开文件 post/test.md ，并增加点内容。

+++
date = "2017-02-10T15:01:33+08:00"
title = "test"
draft = false
+++

Hello Hugo！测试内容

注意：默认创建的是草稿类型，需要将draft值改为false才能看到页面。

推送新文章

!在网站主目录下
hexo new post/文章名.md
hugo --theme=主题名称  !觉得这一步需要改进
cd public
git add -A
git commit -m "描述内容"
git push -u origin master

生成静态网站

hugo --theme=hyde --baseUrl="https://YOURNAME.github.io/"

所有静态页面都会生成到 public 目录下，生成静态网站后并push到你的GitHub Pages 上，就能得到一个在线的个人博客了。

如果一切顺利，所有静态页面都会生成到 public 目录，将 pubilc 目录里所有文件 push 到刚创建的 Repository 的 master 分支。

cd public
git init
git remote add origin https://github.com/coderzh/coderzh.github.io.git
git add -A
git commit -m "first commit"
git push -u origin master