七　月
4
火曜日

使用hugo搭建GitHub page

使用Hugo生成静态网站

安装Hugo到本地

在Hugo官方的release页面，根据本地情况下载对应安装包。

Windows上的安装

  1. 将下载的压缩包解压到C:\Hugo\bin
  2. 将C:\Hugo\bin追加到PATH环境变量
  3. 在Windows控制台中用hugo version对配置进行确认。能输出hugo的版本信息就没什么问题了
> hugo version
Hugo Static Site Generator v0.23 windows/amd64 BuildDate: 2017-06-20T14:01:52+08:00

MacOS上的安装

使用Homebrew 进行安装：

$ brew update && brew install hugo

生成静态网站

C:\Hugo\Sites\hugo-blog> hugo new site hugo-blog
Congratulations! Your new Hugo site is created in C:\Hugo\Sites\hugo-blog.

建议新建C:\Hugo\Sites目录来存放生成的网站。

安装Hugo主题

*可以参考官方的说明。

以本站为例，采用了对汉字和长句显示优秀的主题“六角”。

> cd hugo-blog
> git clone https://github.com/nijohando/hugo-rokkaku-theme themes/hugo-rokkaku-theme

配置静态网站

修改config.toml文件。

baseURL = "http://example.org/"
title = "My New Hugo Site"
# 设置站点对中文的语言支持
languageCode = "zh"
hasCJKLanguage = true
# 设置站点主题
theme = "hugo-rokkaku-theme"

# 以下是和主题相关的一些额外配置项
[taxonomies]
  tag = "tags"
  archive = "archives"

[params]
  limitNumberOfLatests = 5
  logoHtml = "<figure><ul class=\"c-logo\"><li/><li/><li/></ul></figure>"
  styles = ["/css/logo.css"]
  github = "example"
  twitter = "example"
  copyrightHtml = "Copyright &copy; nijohando.jp 2016&ndash;2017"

新建文章及预览

新建一篇文章来确认一下目前为止的各个步骤。

> hugo new post/sample.md
C:\Hugo\Sites\hugo-blog\content\post\sample.md created

对生成的content\post\sample.md进行编辑。 启动Hugo server之后即可在浏览器里预览编辑中的文章。添加-D选项，使得草稿也可以被预览。

> hugo server -D

访问http://localhost:1313/ 即可看到生成的静态网站了。

与GitHub的连携

关于GitHub Pages

对于个人用户而言，GitHub Page有以下分类：

类别 域名 生成网站所用源文件的存放位置
User Pages site 用户名.github.io master
Project Pages site 用户名.github.io/项目名 master ，gh-pages，或 master 的 \docs 目录

为了便于管理和自动发布，可以将生成网站的文件放在一个repo中，把通过hugo生成的html文件放在用户名.github.io repo中。

推送本地Hugo Site到GitHub

在GitHub上新建一个repository，比如hugo-blog，之后可以按以下步骤推送之前的文件。

> git init
Initialized empty Git repository in C:/Hugo/Sites/hugo-blog/.git/
> git remote add origin https://github.com/NeptuneG/hugo-blog.git
> git pull https://github.com/NeptuneG/hugo-blog.git --allow-unrelated-histories
> git add .
> git commit -m "add hugo site"
> git push origin master

使用Wercker进行自动发布

Wercker免费提供建立在Docker上的持续集成服务。 在Wercker创建的应用，会根据关联repository中 wercker.yml 文件进行build。

box: debian
build:
  steps:
    # 为避免"git: command not found"的错误，事先安装git
    - script:
        name: install git
        code: |
            apt-get update
            apt-get install git -y
    # 下载主题
    - script:
        name : download theme
        code : |
            $(git clone https://github.com/nijohando/hugo-rokkaku-theme.git ./themes/hugo-rokkaku-theme)
    # 通过hugo生成html文件
    - arjen/hugo-build@1.19.0
deploy:
  steps:
    - script:
        name: install git
        code: |
            apt-get update
            apt-get install git -y
    # 将生成的html推送到User Pages的repo
    - leipert/git-push:
        gh_oauth: $GIT_TOKEN
        repo: NeptuneG/NeptuneG.github.io
        branch: master
        basedir: public
目次