【Blog#0x02】个人博客搭建：基于hexo+github pages

你是否看到朋友开了微信公众号觉得很酷？你是否想分享自己的学习笔记、生活感想？你是否想拥有自己的个人主页？

那就一起来试试整个博客吧，反正是免费的不用花钱（<ゝω・）☆

方便起见，推荐在自己主系统上面配置博客，或者配置在WSL上。

软件安装

请参考官方文档 | Hexo，Windows安装Git时，全程保持默认选项即可。

注意，其中命令行指令需要在你安装系统的shell上执行。如果是Windows系统的话，需要使用刚刚安装的Git所附带的Git Bash。

静态网站生成

首先，在你电脑上挑一个喜欢的位置，我们会在这里存放博客的文件夹。

然后打开命令行，在这里输入（把 <folder> 替换成你想要的文件夹名）：

1
2
3

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

完成后，这个目录的文件树如下：

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

其中，比较重要的是配置文件 _config.yml 以及存放用户资源（文章、图片）的 source 文件夹。

接下来我们试着创建一篇文章，在当前目录下输入 hexo new <artical_name> （将 <article_name> 替换为你想要的博客标题），hexo会帮你在 source/_posts/ 目录生成一个新的文本文件。

接下来，用你喜欢的文本编辑器（或者markdown编辑器）打开这个文件，就可以使用markdown的语法来写文章啦！如果你之前没有接触过markdown的语法，可以参考一看就懂的Markdown入门语法笔记（整理自Markdown cheat sheet） - 知乎，说是语法其实就是普通的txt文本文件加上一些特殊的标记，特别简洁。

我校树洞也支持md语法，比如在一行字前面加上 # 和一个空格，就能够让它变特别大（一级标题）。

在编辑完成后，在命令行中输入指令 hexo g（g表示generate），hexo会根据当前的主题，将你写的文章转换成一个网页。然后我们再输入指令 hexo s（s表示server），hexo就会启动一个本地的web服务器，访问它给出的链接，就可以看到你的崭新的博客以及你刚写的一篇文章啦！

不过，这只是在本地的网站。接下来，我们会借助github提供的网站托管服务，将我们的网站发布在全球互联网上。

仓库配置

首先，你需要注册一个自己的github账号，记得取一个好记简洁的名字，因为github pages的默认域名就是你的名字。（之后也可以改）

之后我们会需要向github服务器提交我们的博客网站代码，而这背后是hexo通过git来完成的，git又会通过SSH来完成与github服务器的通信。配置属于你的SSH密钥，可以参考Github的官方教程Generating a new SSH key and adding it to the ssh-agent - GitHub Docs。我们生成ed25519算法的key就可以。

在生成并配置好你的密钥后，我们需要将公钥上传到你的github账户上。我们需要在github网站上，点击右上角的头像，找到Settings，然后在左边找到 SSH and GPG keys，点击 New SSH key。

然后我们需要 cat ~/.ssh/id_ed25519.pub ，将其中的内容复制到Key那里，并在Title那里为这个Key取一个名字。然后回到命令行，输入 ssh -T git@github.com，然后输入yes，看提示信息即可确认你有没有成功添加。

之后，我们还需要配置以下git的全局的个人信息，这样你在git提交代码时就会显示你的信息了。如果你用git和别人合作码代码，某次提交出了问题大家就知道应该拷打谁了。

1 2	$ git config --global user.name "cameudis" // 你的用户名 $ git config --global user.email "xxx@xxx.com" // 你的邮箱

然后登上Github网页端，创建一个新的仓库，名字一定要设置为 你的用户名.github.io，权限选择公开。比如我的github用户名是Cameudis，我的仓库就名为 Cameudis.github.io，我的博客网址就会是 https://cameudis.github.io/ （网址URL是大小写无关的）。

创建完毕后，打开你的博客文件夹中的配置文件 _config.yml，翻到最底下，把deploy的配置改成这样：

deploy:
  type: git
  repo: https://github.com/<username>/<project>
  branch: gh-pages

然后在博客文件夹中输入 npm install hexo-deployer-git --save，安装一键部署插件。安装完毕后，直接输入 hexo d（d表示deploy），就可以将hexo生成好的网站上传到github上。之后更新了文章或博客配置，就可以先用 hexo g 生成，用 hexo s 来本地预览，然后用 hexo d 来上传到Github。

注意：有一些功能需要先使用 hexo clean 来将当前生成的网站清空，然后再重新 hexo g 生成。如果你疑惑你的更改怎么没有生效（比如换主题的时候），就可以clean之后再试试。

等待一分钟左右的时间，你就能在属于你的链接上看到属于你的网站了！如果等不及的话，可以在你的博客的github仓库中选择Actions查看部署进度。

后续探索

拥有自己的博客，一大乐趣就是折腾主题、折腾配置，把自己的网站变成想要的样子。

在官方的配置教学中，有着对于 _config.yml 文件的说明。

除此以外，很多东西都在官方的文档中有着说明，推荐都看看。比如如何插入图片就可以查看资源文件夹 | Hexo

我使用的主题是Butterfly（进行了一点魔改），安装、配置请看这里：Butterfly 安裝文檔(一) 快速開始。

我使用的评论插件是Valine，教程请参考使用Valine给Hexo博客添加评论功能 | Cameudis’s Blog

可以使用hexo-blog-encrypt来对某些文章加上密码，教程请看hexo-blog-encrypt/ReadMe_zh