折腾博客系列之博客搭建：Hexo+Github pages

初衷：之前我习惯用印象笔记进行知识的收集和整理，虽然很好用，但终归只适合输入而不适合输出。我需要的是一个更加开放的平台，在这上面可以输出： 1.学习的收获 ；2.生活的感想 ；3.有价值的分享，因此有了这个博客网站。

用hexo+github pages 可以很方便地搭建一个个人博客网站，不需要购买域名和服务器，只需要按部就班操作即可。我自己大概是花了两三个小时搞定，主要是因为对git bash的使用不够熟悉，因此走了一些弯路。实际上动作快的话半个小时就可以搞定。下面是对部署过程的大概介绍，以及必须注意的事项（划重点，也就是所谓的“坑”）。由于本文参考了大量博客，所以在文末我会列出原文链接。

一.Github，Github pages ，Hexo

首先介绍一下这三个东西，有大概的了解、知道是什么东西就可以。GitHub是一个面向开源及私有软件项目的托管平台，而GIthub Pages则是github的一项功能，可以放置网页文件到指定文件夹，然后给你一个专属域名用于展示一些项目，现在大多用来开发和制作个人博客网站。它的好处在于域名和服务器都是免费提供的，并且没有网站数量的限制。而Hexo 是一个快速、简洁且高效的博客框架，它使用Markdown解析文章，在几秒内，就可以利用靓丽的主题生成静态网页。（关于Hexo的详细介绍，请看官方文档 https://hexo.io/zh-cn/docs/ ，这里就不展开了）。因此，可以说github和hexo是绝配。接下来，开始我们的工作。

二. 环境和必要准备

我个人的环境：win10，64bit 必要准备：你需要 （1）github账号 ：前往https://github.com/ 官网注册就好 （2）git ： 最新版本的git（本文发表的时候是2.20.1版本），前往https://git-scm.com/ 官网下载并安装。安装完后前往git文件夹下打开git bash，运行以下命令：

git config --global user.name "username"
git config --global user.email "your mail"

注：将username替换为自己的github账号名，将your mail替换为自己注册github时绑定的邮箱。这一步非常重要，当时部署的时候我因为遗漏了这一步，导致后面报错.

（3）node.js ： 前往 https://nodejs.org/en/ 下载并安装。 这两个的安装比较简单，一路next就好，不过我推荐还是修改一下路径，尽量放在自己可以找到的位置。 （4）hexo ：打开git文件夹下的git bash，运行 以下命令安装hexo

npm install -g hexo-cli

依次运行以下命令进行hexo的初始化

$ hexo init <folder>
$ cd <folder>
$ npm install

注：请将上面代码的<folder>替换成你自己想要的文件夹名字，以我为例，我想要在git文件夹下新建一个Myblog文件夹以存放站点文件，那么我这里的代码就应该是

$ hexo init Myblog
$ cd  Myblog
$ npm install

成功之后，我们会在git文件夹下看到新建的Myblog文件夹，这个就是我们的站点文件夹，网站相关文件都存放在这里。 这里顺便介绍一下cd Myblog的作用，可以理解为“进入Myblog运行git bash”，你也可以在Myblog中右键运行git bash（如下图），效果是一样的。

在之后介绍的操作中，凡是需要输入命令的，请确保你已经cd进自己的站点文件夹。

接着上面的代码，我们继续运行：

hexo server

这将在本地打开我们的网站，当提示”xxx is running at xxx“的时候，我们可以通过网址预览我们的网站，想要切断连接，只需要在命令行窗口按下ctrl+c。至此，hexo博客已经在本地搭建好了。接下来，我们要将hexo和github进行对接。

三. hexo与github 实现对接

1.建立仓库

还记得我们之前注册的github账号吗？现在，请进入github网站，并点击头像选择your repository，我们现在需要创建一个仓库（也就是repository）用于存放相关站点文件。按照下图顺序进行设置：

其中，Repository name也即是我们的仓库名字，必须是 Github账号名称.github.io的格式。比如你的github名字是ccc，那么仓库名字必须是ccc.github.io 。

2.对接github 在git bash中运行以下命令，安装 hexo-deployer-git 插件。

npm install hexo-deployer-git --save

运行以下命令，创建SSH key。（注：和上面一样，请将your mail替换成github邮箱地址）

$ ssh-keygen -t rsa -C "your mail"

前往 C:\Users\Administrator.ssh\id_rsa.pub （注意，这只是大概位置。不同系统路径可能不同，但是大同小异）打开id_rsa.pub文件（可以用记事本打开，但是推荐用sublime text）。复制文件中的全部内容，前往 https://github.com/settings/keys ，将刚才复制的内容粘贴在New SSH key 的文本框中。

前往站点目录下（例如：git/ Myblog），打开_config.yml 文件，对文件末尾进行如下修改：

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
    type: git
    repo: git@github.com:username/username.github.io.git
    branch: master

在这里要注意，1）所有的冒号距离右边的内容之间都有一个空格，如果没有空格，则修改是无效的。2）和前面一样，将usename替换成我们自己的github用户名 。 3）repo后面的地址，在旧版本的hexo中是http地址，但在新版本的hexo用的是ssh地址，我们统一用如上所示的ssh地址。有些博客由于没有进行更新，在说明这个问题的时候依然用的是http地址，造成了一定程度上的误导。

运行以下命令，对接并推送内容到github。

$ hexo g
$ hexo d

等待片刻，打开 https://<Github账号名称>.github.io （例如 https://ccc.github.io ) 即可进入你搭建好的个人博客网站了。当然，网站默认用的是landscape主题，比较难看，关于主题的美化和后期一些插件的添加，可以参考文章末尾贴出的链接。

PS：

这里顺便介绍一下常用的 hexo 命令： hexo clean ————————>清除缓存文件和已生成的静态文件 hexo g 或者 hexo generate ————————>生成静态文件 hexo d 或者hexo deploy ————————>生成静态文件并部署到仓库 hexo s 或者 hexo server —————————>在本地打开网站

一般来说，在对网站进行修改后，我们可以先用hexo g和hexo s 在本地预览效果，如果效果符合预期的话再用hexo d 推送到 github。当然，可能会遇到本地打开和域名打开的效果不一致，这种情况下通常是因为 1. 没有用hexo clean 清除缓存 2. 没有清除浏览器缓存（ctrl+f5 ） 3.忘记用hexo d 将本地文件推送到github 4. 本地和线上的同步本身需要时间，所以上述方法如果无效，可以尝试等几分钟，再打开网站就正常显示了。

参考自： https://www.jianshu.com/p/3a05351a37dc https://www.simon96.online/2018/10/12/hexo-tutorial/