一， Hugo简介

​ Hugo是基于Go语言开发的个人静态Blog框架，优势在部署简单。但是由于是静态网站，文章需要在本地编辑，转化为静态网页后才可以显示在Blog部署的环境中。

二， Hugo相关资料

-  安装包下载地址（Github）[https://github.com/gohugoio/hugo/releases]
-  中文文档翻译 [https://www.gohugo.org/doc/overview/introduction/]
-  主题下载站   [https://themes.gohugo.io/]

三， Hugo的第一次启动

1，安装

​ 在上述网址中下载好对应安装包。由于我的环境是Windows10专业版64位。所以下载版本为windowsx64版本。解压后会得到hugo.exe的可执行文件。

​ 将可执行文件放入你要安装hugo的位置（最好全英文路径）本文路径为 D:\Hugo\bin，将此路径加入到本机PATH环境变量中即完成安装。

​ 想要确定是否安装成功，在cmd中输入：

1

hugo version

​ 如果出现下图显示，即安装成功

1

2，创建自己的Blog

​ 首先，确定好Blog建立的位置，我选择的路径为D:\Hugo\Sites 。键入命令

1

hugo new site D:\Hugo\Sites

2

​ 便在对应的位置成功生成了属于你的Blog

3， 创建第一篇文章

​ 在hugo中，文章都是以Markdown文件存储的。因此，掌握Markdown的写作语法还是很有必要的。

​ 我们进入Blog中的根目录下，在post文件夹下创建第一篇名为Blog1 的文章

1
2
3

hugo new post/Blog1.md

## 如果成功，在content/post 目录下会出现名为Blog1.md的文件。利用markdown语法进行编辑即可

​ 在文档中，我们写下Hello World！标题，作为测试

3

​ 可见，hugo新创建的文章中，标题与时间都已经自动添加好了。只需要我们专注于内容书写即可

4，设置主题

​ 在上文提到的主题下载站选择自己喜欢的主题样式，在主题页面按照对应操作步骤进行git clone即可

​ 值得一提的是，完成hugo的部署一定是需要git的参与的。

1

git clone https://github.com/flysnow-org/maupassant-hugo themes/maupassant

在 themes 文件夹中就会看到安装好的主题文件夹

4

5, 运行测试

在根目录中的 config.toml 文件中，加入如下命令

1

theme = "maupassant"  ## 关联Blog中的主题

在根目录中打开命令行，输入如下命令启动

1

hugo server -D

在本地就可以看到

port 1313 already in use, attempting to use an available port
Building sites …
                   | EN
-------------------+-----
  Pages            | 10
  Paginator pages  |  0
  Non-page files   |  0
  Static files     |  5
  Processed images |  0
  Aliases          |  2
  Sitemaps         |  1
  Cleaned          |  0

Built in 29 ms
Watching for changes in D:\Hugo\Sites\{archetypes,content,data,layouts,static,themes}
Watching for config changes in D:\Hugo\Sites\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:4761/ (bind address 127.0.0.1)
Press Ctrl+C to stop

在浏览器中输入其中的http://localhost:4761/ 即可访问本地站点

四， 将博客部署到Github中进行访问

1， 在Github中新建一个仓库

注意！ 仓库名称一定要是你的用户名+github.io

例如我的就是hxyhlhz.github.io

5github

如果你有自己的域名的话，可以在建成仓库后进入settings选项卡

6settings

在红色方框的位置添加自己的域名（可不用备案）

7自定义域名

2， 进行推送

​ 在根目录中的 config.toml 文件中，将baseURL = “http://hxyhlhz.github.io"中改为你的仓库名称。

注意前面要有https://

​ 在根目录中打开cmd命令行，输入

1

hugo --buildDrafts

此时根目录下会多出名为public的文件夹

在此文件夹下右键进入Git Bash界面，依次输入

1

git init      ## 初始化为git文件夹

8初始化

1
2

git add *      ## 提交文件所有内容
git commit -m "博客的第一次提交"     ## 添加分支

9提交

1
2

git remote add origin https://github.com/username/username.github.io.git  
##与你的github仓库关联，其中username为你的用户名

​ 随后你就可以使用git push命令进行推送了。

在第一次推送时可能需要进行与gihub的链接。所以一般使用下面命令进行推送。期间可能会进行github账户的验证

1

git push -u origin master      ## 推送到master分支

完成后会显示如下图所示情形

10推送完成

后续更新博客即进行上述操作（无需重复进行关联github操作）即可！

至此，我们完成了一个基于Hugo的个人博客的搭建。

后续更新

1，渲染后文章不显示

在我对Blog模板更新时发现，套用模板后进行本地调试文章不显示。查阅资料后发现为文章表头处，默认draft参数为true，创建的是草稿类型，需要将draft值改为false才能看到页面

文章