搭建基于Hugo的GitHub站点

Hugo简介

“Hugo，世界上最快的网站建设框架。”

Hugo以Go编写，是根据Apache许可证2.0提供的开源静态站点生成器。

Hugo支持TOML、YAML和JSON数据文件类型、Markdown和HTML内容文件，并使用短代码添加丰富的内容。其他值得注意的功能包括分类学、多语言模式、图像处理、自定义输出格式、HTML/CSS/JS缩小以及对Sass SCSS工作流程的支持。

Hugo利用各种开源项目，非常适合博客、公司网站、创意作品集、在线杂志、单页应用程序，甚至数千页的网站，适用于那些想自己网站编写代码而不必担心设置复杂的运行时、依赖项和数据库的人。

使用Hugo构建的网站速度极快、安全，可以部署在任何地方，包括AWS、GitHub Pages、Heroku、Netlify和任何其他托管提供商。

安装Hugo

Linux

CentOS

wget https://github.com/gohugoio/hugo/releases/download/v0.41/hugo_0.41_Linux-64bit.tar.gz

tar -zxvf ./hugo_0.41_Linux-64bit.tar.gz

cp ./hugo /usr/local/bin/

MacOS

brew安装

brew install hugo

Windows

Hugo官方文档中给出了choco和scoop两种安装方式

choco安装

1.使用powershell安装Chocolatey：

iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))

2.查看choco版本验证安装：

choco version

3.使用choco安装hugo或hugo-extended：

choco install hugo -confirm  

choco install hugo-extended -confirm

4.如果安装hugo过程中速度过慢可配置choco代理：

choco config set proxy http://localhost:port

scoop安装

1.使用powershell安装scoop：

    iex (new-object net.webclient).downloadstring('https://raw.githubusercontent.com/lukesampson/scoop/master/bin/install.ps1')

2.使用scoop安装hugo或hugo-extended：

scoop install hugo  

scoop install hugo-extended

部署Hugo

以GitHub Page为例：

新建库

在GitHub内创建Repository，命名为username.github.io

https://github.com/new

安装Git

Windows

在Git官方网站下载运行安装

https://git-scm.com/downloads

Linux

yum install git

配置Git

1.设置user.name和user.email配置信息：

git config --global user.name [GitHub user.name]  

git config --global user.email [GitHub user.email]

2.生成ssh密钥文件，默认不需要设置密码：

ssh-keygen -t rsa -C [GitHub user.email]

3.找到生成的.ssh目录中的id_rsa.pub密钥，复制内容：

Windows路径

C:\Users\user.ssh\id_rsa

Linux路径

/home/user/.ssh/id_rsa

4.打开 https://github.com/settings/keys：

新建new SSH Key，粘贴复制的id_rsa.pub密钥，点击Add SSH key

5.检测GitHub公钥设置是否成功：

ssh git@github.com

X.配置git代理

git config --global http.proxy http://localhost:port	#设置git代理

git config --global --unset http.proxy			#取消git代理

编辑~/.gitconfig查看git代理设置

新建站点

在需要存放站点的目录下执行：

hugo new site website

设置主题

1.在站点根目录克隆主题到站点根目录下的themes文件夹：（以当前stack主题为例，其他详见Hugo官方主题页面）

git clone https://github.com/CaiJimmy/hugo-theme-stack/ themes/hugo-theme-stack

具体站点配置以主题说明文档为准，这里使用的stack主题文档说明需要：
- 删除站点根目录下的config.toml默认配置
- 将该主题目录内的exampleSite文件夹里所有文件复制到站点根目录

2.运行本地服务：

hugo server

这里报错无法启动服务，将提示错误的站点根目录\content\post\rich-content\index.md文件删除即可

3.输入默认本地网址访问：

localhost:1313

编辑路径

以当前stack主题为例，站点的各个常用编辑路径如下：

\站点根目录\config.yaml					#主站配置
	|
	|————\static\					#图片目录
	|
	|————\assets\img\				#头像目录
	|
	|————\content\page\		
	|	|	|——about.md			#关于页面
	|	|	|——archives.md			#归档页面
	|	|	|——search.md			#搜索页面
	|	|
	|	|——\post\				#文档目录
	|	|
	|	|——\categories\				#标签目录
	|
	|————\themes\					#主题目录

推送站点到GitHub

首次部署推送

1.在站点根目录执行hugo命令生成最终页面：

hugo

生成的文件默认存放在站点根目录下public目录中。如果未生成任何文章，去掉文章头部的 draft=true 再重新生成

2.在生成的public目录下执行下列操作：

git init

git remote add origin "https://github.com/user/user.github.io"

git add -A		
				
git commit -m "first commit"

git push -m origin master

3.至此你的站点就被推送到GitHub上了，输入你的GitHub站点网址查看：

https://user.github.io

后期修改推送

1.将第一次生成后的public目录删除，并重新生成推送：

hugo

cd public

git init

git remote add origin "https://github.com/user/user.github.io"

2.此时可根据需要进行的操作选择对应指令：

git add -A					#提交所有改动

git add -u 					#提交修改的和被删除的文件，不包括新文件	

git add . 					#提交新文件和被修改的文件，不包括被删除文件

3.完成后执行下列操作：

git commit -m "update message"

git push -f origin master

4.输入GitHub站点网址查看：

https://user.github.io

注意备份站点！

HUGO食用指南