Hexo+github 个人博客搭建教程

几个月前，在几乎还是对GitHub一无所知的情况下用Hexo搭建博客，找过很多的教程，但是都在中途因为不知何起的报错而结束，或是步骤，或是教程不匹配。网上存在的教程要么复杂不适合入门，要么就是过于啰嗦。东拼西凑，于是写了这篇精简步骤。
Publish Date：2016.10

基本步骤

1. 注册GitHub并创建仓库。
2. 安装部署环境。
3. Hexo以及npm的安装与配置。
4. Hexo与GitHub仓库的连接。
5. 页面部署以及文章发布。
6. 主题更改。

---

注册GitHub并创建仓库

1. 打开https://github.com/ 点击sign up注册自己的GitHub账号，依次输入用户名、邮箱、密码，并且牢记这三项信息。Step2与Step3可按照自身实际情况输入，点击Creat来创建。
2. 当创建完毕后会提醒新建一个工程，但此时邮箱未验证，不能创建工程，点击“Start a project”根据步骤验证邮箱。
3. 新建一个Repository（仓库），切记Repository name应按照 XXXX.github.io的形式,其他选项保持默认，至此，拥有一个空仓库的github账号就创建完成了。

安装部署环境

这里说的环境是指 安装node和Git，Unix发行版本自带git,但是node需要手动安装。
环境安装中所有选项均为默认选项，无需更改。安装完成后

Hexo以及npm的安装与配置

在喜欢的目录下创建BLOG文件夹，并在目录下执行以下命令：

npm install hexo-cli -g

等待install完毕后继续输入：

npm install hexo --save

这个命令执行时间较长，耐心等待绿色用户名出来以后再进行下一步操作

下一步输入：

hexo -v

如果出现相应版本信息，说明hexo部署成功。

---

接下来对Hexo进行操作
1.初始化Hexo，命令结束后，你所在的BLOG文件夹会有相关配置文件生成。

hexo init

2.安装npm组件

npm install

3.开始部署本地静态页面

hexo g

4.本地服务器预览

hexo s

会出现INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.
然后在浏览器中输入localhost:4000就能预览到默认的Hexo主题。

---

Hexo与GitHub仓库的连接

本地与GitHub仓库的连接是重点也是最容易出错的点，所以在这个部分务必按照步骤来。

1. 打开选好的BLOG文件夹，其根目录下有_config.yml配置文件，此为博客配置文件。用文本编辑器打开将最后改为：

   deploy: 
       type: git
       repository: https://github.com/username/username.github.io.git
       branch: master
   

   倒数第二行的repository是自己仓库地址，切记要在仓库地址后添加.git

2. 在控制台设置自己的用户名和邮箱

   git config --global user.name "username"
   git config --global user.email "example@mail.com"
   

3. 生成密钥

   ssh-keygen -t rsa -C "example@mail.com"
   

这一步需要连续输按3次回车以设置空密码

4. 将密钥粘贴到GitHub Setting.

   • 密钥默认的生成路径为C:\Users\用户名\.ssh文件夹(Unix系统位于~/.ssh)，将此文件夹下id_rsa.pub以文本文档形式打开并复制。

   • 登陆GitHub，个人中心点Setting，左侧SSH and GPG keys，然后右侧新建一个SSH key，将刚才复制的密钥粘贴到Key框，点击Add SSH key以保存。

5. 为仓库开启GitPages

   打开自己的仓库，点击仓库中的setting,下滑Choose a theme 随便select一个主题布局，并保存。

6. 测试本机与GitHub的连接

   控制台输入

   ssh -T git@github.com
   

   如果显示:
   Hi XXXX! You’ve successfully authenticated, but GitHub does not provide shell access.

   说明配置连接正常

7. 安装npm的发布拓展（Git控制台）：

npm install hexo-deployer-git --save

耐心等跑完，部署阶段就到此完成。

页面部署以及文章发布

1. 部署本地静态页面

   hexo g
   

2. 本地服务器预览页面

   hexo s
   

3. 确认无误后发布页面

   hexo d
   

4. 解释一下Git控制台的常用命令含义

   hexo n "title"	    // n=new 新建一篇文章
   hexo g				// g=generate 本地部署生成
   hexo s				// s=server 可以在localhost预览
   hexo d				// d=deploy 发布至GitHub
   hexo -v		        // v=version 显示hexo版本信息