Hugo+Gitee 搭建我的博客

前言

这是一篇用来记录我第一次搭建我的博客的文章。

目前能够用来建站的脚手架有不少，所用的开发语言也各不相同。例如： 使用PHP开发出来的WordPress，使用JS开发的Hexo，使用Go开发的Hugo。客观来看，使用哪一种框架都没太大差异。大部分人，包括我，仅仅是在这个框架上写markdown罢了(笑)。

下面记录的，是我在使用Hugo搭建我的博客时总结出的步骤。仅以此文，但愿能让其余小白，包括之后想从新搭建的我，少踩一些坑。

基础概念

什么是Hugo?

Hugo是一个用来生成静态网站的工具，使用Go语言编写的。从网上不少人的评论看，Hugo的显著优势就是部署快！

什么是Gitee?

Gitee(码云) 是开源中国推出的基于 Git 的代码托管服务，相似于Github。最基础的用法，就是使用它保管开发者的代码，进行版本控制。

在搭建时，使用Hugo打包构建静态网站，输出一个纯静态的资源包。将这个静态资源包上传到Gitee，就能实现站点部署。

搭建步骤

1.安装Hugo

1.1 进入GitHub上Hugo/release页面，下载对应操做系统的安装包。例如我是Win10,下载的是当前最新版本 hugo_0.74.3_Windows-64bit.zip。

1.2 下载完毕后，将程序解压到某个文件夹下。

1.3 配置环境变量。

1.4 当在命令行运行如下命令，能输出截图所示内容时，证实安装成功。

hugo version

2. 生成站点基础框架
Hugo提供 new 命令，用于生成新的网站，运行如下命令，便可生成新的网站框架。

hugo new site my_website_name

框架结构以下图所示。

3. 安装主题
3.1 进入Hugo主题页面，找到须要的主题。例如我使用的主题是LoveIt。
3.2 将主题克隆到 themes 目录。例如我，是运行如下命令，使用git下载到本地的。

git clone https://github.com/dillonzq/LoveIt.git themes/LoveIt

4. 配置主题
不一样的主题，咱们须要按照主题提供的文档进行配置。如我使用的主题LoveIt，在GitHub上有相关连接，能够跳转到该主题的配置文档页面。

在配置完成后，若想在本地访问搭建的站点，只须要运行：hugo server 命令，接着在浏览器访问 http://localhost:1313 便可。后续在自定义样式，或者编写博客时，能够经过访问该地址，进行实时预览。

5. 编写博客
在网站框架根目录内，使用 hugo new posts/blog_name.md 命令建立博客。使用MarkDown语法编辑博客内容。

6. 打包构建
在网站框架根目录下，使用 hugo 命令打包构建。运行该命令后，会生成一个 public 目录, 目录内包含了网站的全部静态内容和资源。

7. 在Gitee上创建仓库，上传资源包
7.1 申请Gitee帐号。
7.2 在Gitee上创建仓库。
根据在Gitee里的Gitee Pages 静态页面托管说明,仓库名最好与我的空间地址一致，例如我我的空间地址为JihahaCabin，我创建的仓库名也为JihahaCabin。

若是你想你的 pages 首页访问地址不带二级目录，如 http://ipvb.gitee.io，你须要创建一个与本身个性地址同名的仓库，如 https://gitee.com/ipvb 这个用户，想要建立一个本身的站点，但不想以子目录的方式访问，想以ipvb.gitee.io直接访问，那么他就能够建立一个名字为ipvb的仓库 https://gitee.com/ipvb/ipvb 部署完成后，就能够以 https://ipvb.gitee.io 进行访问了。

7.3 在public目录下，运行如下命令，将public目录下全部文件，上传到Gitee仓库。${git_address} 表示在上一步创建的仓库地址。

git init 
git add . 
git commit -m "init" 
git remote add origin ${git_address}  
git push -f origin master

8. 配置Gitee Pages
8.1 登陆Gitee，找到上传的仓库，点击"服务"下拉框，点击"Gitee Pages"选项。

8.2 选择部署分支，点击"启动"按钮。

实际效果

访问 Gitee我的空间地址名.gitee.io，便可看到部署的静态网站内容，如我搭建的博客地址为JihahaCabin.gitee.io。