博客搭建 | 栖迟於一丘

之前一直在 CSDN 写点东西，今天心血来潮尝试了 GitHub Pages + Hexo 的方式，真香，跟着教程手把手来的，但还有一些没提到的小坑，这里做一个汇总

自己跟的两个教程是：

上面个两个教程比较精简直接不过年岁有点久了，在实际操作中我遇到的坑主要是

安装时注意目录的选择，尤其是像我这种习惯只用一个盘的用户，看到安装就惯性选择 Program Files，结果在后面更改部署时控制台一直提示权限不够，不怕麻烦可以每次选择 以管理员身份打开 终端，其实没有必要，只要环境配置正确，博客文件的根目录放哪都行
本地资源主要以图片为主，但大量的图片也会导致每次的部署缓慢，这里推荐一个图床 PicX
部署时实用的 SSH 默认为 22 的端口号，偶尔会遇到占用的情况，这时候可以在其目录：C:\Users\userName\.ssh创建一个 config 文件（没有后缀），在其中写入

Host github.com
User # GitHub 的邮箱
Hostname ssh.github.com
PreferredAuthentications publickey
IdentityFile ~/.ssh/id_rsa
Port # 更改端口

不翻墙的情况下，即便 SSH 端口号没有占用，也会出现部署连接失败的情况，这时候就需要开启全局代理
1. “网络和 Internet 设置” => 代理，复制“脚本地址”到浏览器
2. 会自动下载一个 pac 文件，找到其中的 PROXY
3. 执行 git config --global https.proxy #PROXY_value
下载主题模板时如果自定义需求较少，可以使用 npm 或 git clone 的方式下载，然后拷贝配置文件，如果修改项比较多，可以下载 release 版压缩文件手动添加

第一次更新：文件托管外链

使用过程中发现自己有文件下载的需求，放到目录部署的操作性太差，容量大了部署也吃不消，考虑到和图床使用的类似操作，我这边选择的是七牛云，刚跟客服挂掉电话，也不用什么教程，操作界面很清晰，上传文件之后获取外链使用即可，如果没有自己的域名可以买一个（需要备案，阿里云最便宜有首年几块钱的），也可以使用 files.userName.github.io 使用海外域名，但后续使用可能不太方便，譬如出现限制访问的情况

第二次更新：排版和渲染

中英文之间的添加空格，以提升阅读体验，其实我本身是有文档书写时手动添加空格的习惯，也尝试过一些本地使用的排版插件，如：pangu，但这些插件往往也会对语法符号（如：#、*）进行空格插入，造成排版与预期不符，但目前使用的 hexo-filter-auto-spacing 插件，或者说这一系列插件都不会产生这样的问题，因为是将已渲染完成的 html 页面进行中英文空格插入

有研究显示，打字的时候不喜欢在中文和英文之间加空格的人，感情路都走得很辛苦，有七成的比例会在 34 岁的时候跟自己不爱的人结婚，而其余三成的人最后只能把遗产留给自己的猫。毕竟爱情跟书写都需要适时地留白 ^[1]

使用 Hexo 默认的渲染器 hexo-renderer-marked 是不支持注脚或者其他 Markdown 的非核心功能，当然这可以使用渲染插件来解决，但是没有必要，我这边直接换了底层渲染器，目前功能最强大的是：@upupming/hexo-renderer-markdown-it-plus 跟着教程操作就好了

hexo-renderer-markdown-it-plus 是默认支持 Katex 数学公式的，但还需要在每篇文章前放入渲染引用，所以直接将其写入到 /scaffolds/post.md 的模板当中，这样每次创建时就无需手动添加

---
title: {{ title }}
date: {{ date }}
categories:
tags:
sticky:
---

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0-rc.1/dist/katex.min.css">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0-rc.1/dist/katex.min.js"></script>

<!-- 摘要 -->
<!--more-->
<!-- 正文 -->

第三次更新：GitHub Actions 自动部署

可以直接在线编辑 md 文件，立即生效。假设你已发布一篇文章，过几天你在别的电脑上浏览发现有几个明显的错别字，这是完全不能容忍的。但此时你电脑上又没有 hexo + node.js + git 等完整的开发环境，重新配置开发环境明显不现实。如果使用 CI，你可以直接用浏览器访问 GitHub 上的项目仓库，直接编辑带错别字的 md 文章，改完，在线提交，稍等片刻，你的网站就自动更新了

如果手动部署，需要先执行 hexo g 编译生成静态文件，然后推送 public 整个文件夹到 GitHub 上，当后期网站文章、图片较多时候，很多时候连接 GitHub 不是那么顺畅，经常要傻等很长的上传时间。使用 GitHub Actions 自动部署，你只需 push _post 文件里单独的 md 文件即可，其他不用管，效率瞬间高了许多，其中的好处，谁用谁知道

使用 GitHub Actions，你还可以一次性将这些静态博客页面部署到多个服务器上，例如：GitHub Pages、Gitee pages、七牛云、阿里云、腾讯云等等

用了之后发现确实不是大话，好用归好用，但是配置属实有些麻烦，而且还不懂 Workflow 语法，自动部署教程
注意自动部署的时候，根目录下的 .deploy_git 最好删掉

第四次更新：http 图床与 https 协议不能混合

GitHub Pages 中是支持 https 协议的，也有自动续费的安全证书，但是大部分图床外链都是采用 http 协议，导致不能显示，这里提供三个解决方案：

将协议指向去掉，链接直接使用 // 开头，让其自己尝试协议（我用这种方式没成功）
关闭 GitHub Pages 中的协议支持，并删除 DNS 中的相应记录
升级图床链接（大部分图床都是 https，不是的也大都支持更改）

第五次更新：URL 规范

在 _config.yml 中可以配置文件的链接形式，一般是日期加文件名的形式，但是也可以使用 -s 指定 URL，但是最实用的方式，还是将 URL 格式修改为文件名。至于创建的规范大致如下：

(M) url 的单词使用全小写，避免驼峰的方式
(S) 如果有多个单词使用 _ 进行连接（但是我使用的是 -）
(M) url 必须有其含义，避免使用序号和随机数字，使用数字的使用尽量替换为英文序数而不是基数

盘古之白的说法和这句话来源于 GitHub 中一个自动添加空格的小工具。其真实性不详 ↩︎