Hexo博客搭建

本文包括几部分：安装前准备，Hexo配置，关联GitHub和如何部署等

具体实现流程是什么？Hexo是静态博客托管平台，我们在本地可以编辑博客，更换主题等。当我们在本地编译好网站之后，我们可以将与本地博客相关联的托管仓库更新，随后网站就可以与本地一起更新了

1. 安装前准备

在使用Hexo写博客之前，我们需要对GitHub，Git，nodejs以及hexo做一些配置

1.1 GitHub账号

在GitHub官网申请账号，并新建一个和自己名字相同的github.io仓库，比如我这里叫harrytea，就新建一个名为harrytea.github.io的仓库。仓库主要用来存储自己的博客文件

1.2 安装Git

Git的安装很简单，根据官网下载安装即可：git官网

1.3 安装nodejs

hexo是基于nodejs写的，安装nodejs，nodejs官网

sudo apt-get install nodejs
sudo apt-get install npm

安装完后运行下面命令检查是否安装成功node -v npm -v

1.4 安装hexo

hexo是一个快速、简洁高效的博客框架，主要使用Markdown语言来解析文章，几秒内就可以生成静态网站。我们可以使用hexo创建文章，修改主题等，hexo官网

npm install hexo-cli -g

这个命令可能会报错，如果报错根据错误提示命令改为sudo npm install hexo-cli --location=global，然后输入hexo -v检查是否安装成功

2. Hexo基本命令

1. 初始化hexo文件：在本地任意创建一个文件夹（这里创建名字为hexo-blog的文件夹），用下面命令将其初始化

hexo init hexo-blog
cd hexo-blog
npm install

2. 创建文章: 使用下面命令创建一篇文章，当title里面包含一些特殊字符时，我们可以加上双引号

hexo new post <title>
hexo new post "<title>"

3. 生成静态文件: 生成静态的html文件等，方便查看和部署

hexo generate
hexo g

4. 启动本地服务器: 启动本地服务器，查看生成的网页

hexo server # 默认网址: http://localhost:4000/

5. 部署网站: 将本地生成的网页部署到服务器端

hexo deploy
hexo g -d # 可以结合g一起使用，即生成静态网页后直接部署

6. 清除缓存: 清除缓存文件（db.json）和已生成的静态文件（public），在某些情况下（例如更换主题后），如果对网站做操作网站没反应，可以使用此命令

hexo clean

3. Hexo的基本运行过程

3.1 Hexo的目录结构

在上传到GitHub之前，我们需要了解一下hexo的目录结构，执行完hexo init <folder>命令之后，我们的文件夹如下所示

|-- _config.yml # 配置信息，可以在这里配置网站的大多数参数
|-- package.json # 查看hexo的版本以及相关依赖包的版本信息
|-- scaffolds # 模板文件夹，新建文章时，会根据这里的模板生成文件
|-- source # 资源文件夹
|   |-- _drafts # 草稿文件夹
|   `-- _posts # 文章文件夹
`-- themes # 主题文件夹，根据主题来生成静态页面

其中source是资源文件夹，用于存放用户资源，例如图片，文章等等，每次编译时，_post文件夹下中的md文件会被编译为html文件并放到public文件夹下，其余非下划线开头的文件和文件夹会被原封不动的复制到public文件夹下

3.2 Hexo生成静态文件

如上面所述，source是资源文件夹，public是自动生成的静态文件夹，在执行hexo generate后，会将source中的md文件转化为html文件，再结合主题渲染成为我们最终看到的博客。

执行hexo clean后会删除db.json和public文件夹下的所有文件

3.3 Hexo部署到GitHub

执行hexo deploy后，会将public文件夹下的文件推送到GitHub中，并生成.deploy_git文件夹，此文件夹和public文件夹一致

hexo generate # 根据source生成/更新public
hexo deploy # 根据public生成/更新.deploy_git

4. 通过GitHub部署到Netlify

4.1 与GitHub仓库关联

首先在GitHub上创建一个仓库，随后复制刚才的GitHub地址，进入到本地的blog根目录，将二者关联起来

git init
git remote add origin https://github.com/name/your-Repository.git

然后在.gitignore中写我们不想推送的文件

.DS_Store
Thumbs.db
db.json
*.log
node_modules/
public/
.deploy*/
themes/
_multiconfig.yml

之后推送即可，此时我们的内容都保存在GitHub对应地仓库了（这样可以防止本地的数据丢失）

注意: hexo deploy部署命令，这个命令会将public目录中的文件和目录推送至_config.yml中指定的远端仓库和分支中，并且完全覆盖该分支下的已有内容

Ok，现在到了最关键的时刻了：这里我们将我们博客的一些源文件，比如source中的md文件推到GitHub关联的仓库的master分支中，而根据hexo deploy的特性，他仅仅只能将public文件夹下的文件推到另一个分支（这里设置的是run-page）。为什么这样呢？因为我们有了source信息之后，我们可以在本地重新生成public文件夹，所以没有必要把public文件夹推到GitHub的master分支。如下所示，二者通过一个仓库关联起来，互相在不同的分支，互不干扰

|-- source等文件 -- master分支
|-- public文件夹 -- run-page分支

在_config.yml中设置run-page分支的方法如下

deploy:
  type: git
  repository: git@github.com:name/your-Repository.git
  branch: run-page

4.2 托管到netlify

首先进入到netlify官网注册一下账号

这里因为部署过了，所以现在不写了，后续有时间写