Hexo + Obsidian + Git 完美的博客部署与编辑方案

1. 前言

在之前的文章《Hexo 快速搭建指南》中，重点讲解了如何搭建以及部署博客。但是在后期写博客的过程中，有可能遇到很多麻烦，比如：

• 我不想手动维护文章的 Categorys，我想以文件目录的形式管理文章分类
• VSCode 编写 Markdown 文件不爽，我想用其他的编辑器来写 Markdown
• hexo new 指令生成的模板太拉了，我不想用
• 我想把我的 markdown 文档同步到云平台上，方便我的其他设备即时查看

那么这篇文章就会教你使用最舒服的姿势来后期维护你的博客，减少心智负担与解决各种不爽的地方。

2. 更好的文章管理方案

2.1 文章以目录分类

当我们写好一篇文章后，按照 hexo 的默认配置，我们需要将其放在 source/_post 目录下，等时间长了之后，_post 目录下的文章就会变得杂乱无章，无法让我们快速的 review 到一篇文章。

那么最好的解决方案就是我们在创建文章的时候以 文章分类 作为文件夹创建我们的文章，比如：

.
└── source
    └── _post
        ├── 前端
        │   ├── Javascript
        │   │   └── Javascript原型链机制.md
        │   └── 浏览器
        │       └── 浏览器性能优化.md
        └── 后台
            ├── GoLang
            │   └── go语言简介.md
            └── Java
                └── Spring MVC 快速入门.md

2.2 根据文件目录自动生成 categories 信息

虽然我们把文章放的井井有条了，但是每个文章里的 categorys 字段还是要我们手动自己维护的，比如在 source/_post/前端/Javascript/Javascript原型链机制.md 文件中，我们要通过手写 categories 来让 hexo 知道这篇文章被放在 前端-Javascript 分类下：

---
title: Javascript原型链机制
categories:
  - 前端
  - Javascript
date: 2022-06-05 12:06:47
---

这里是正文

为了省去手动维护 categorys 字段的这个问题，我们可以使用 hexo-auto-category 这个插件。这个插件在 Hexo 进行 build 的时候会去自动根据文章目录情况来自动修改文章的 categories 信息，更详细的部分可以看作者的文章。

除此之外最好修改一下 _config.yml 中的两处默认配置：

# 修改 permalink 让你的文章链接更加友好，并且有益于 SEO
permalink: :year/:month/:hash.html

# 规定你的新文章在 _post 目录下是以 cateory 
new_post_name: :category/:title

2.3 提交代码时自动生成新文章的 categories

但是这里有一个问题，就是只有 hexo 在执行 hexo generate 或者 hexo server 时候才会去触发 categories 的生成，那么每次我们创建文章都要经历这样的工作流：

1. 创建分类目录，写文章，文件名推荐与文章标题一致（不用关心 categories 写什么）；
2. 填写 title、date、tag 等元信息（这个文章后续再讨论如何省去这一步）;
3. 执行 npx hexo generate 在构建博客的时候触发 hexo-auto-category 插件的自动矫正 categories 功能；
4. 检查文章中的 categories 是否正确；
5. 添加 git 工作区变更，并提交并推送代码到 github。

为了简化这些工作，我们可以使用 git hook，在我们每次执行 commit 前都自动运行 npx hexo generate 触发自动生成 categories 的行为，并将生成后的变更自动添加到本次提交中，然后一同 push 到 github 上去。这里可以使用 husky 来很方便的设置这样一个 git hook。

GitHook 可以在执行代码的 commit、push、rebase 等阶段前触发，做一些前置行为，比如在每次提交代码时候执行一段 shell 脚本，来做一些代码检查或者通知 ci 等操作。

Husky 采用了更简单的一种方式，让管理 GitHook 更加现代化

关于 Husky 的使用可以参考我之前的文章《使用 husky 每次提交时进行代码检查》

你可以按照如下步骤快速完成设置：

1. 安装 huksy：npm install husky --save-dev
2. 执行 huksy 初始化指令：npx husky install
3. 在 package.json 中的 scripts 中写入："prepare": "husky install"
4. 在生成的 .husky 目录创建 pre-commit 文件（有的话就不用创建），并写入以下内容：

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npx hexo generate && git add .

如果提交代码的时候，终端出现类似的构建过程，就说明由 husky 创建的 git hook 生效了：

这样你新建一篇博客的工作流就简化为：

1. 创建分类目录，写文章；
2. 填写 title、date、tag 等元信息;
3. 添加 git 工作区变更，并提交并推送代码到 github。

这样就解决了令人头疼的文章分类问题~

3. 使用 Obsidian 来编写和管理文章

Obsidian 是目前个人感觉使用起来最舒服的基于 Markdown 的笔记管理工具，好处不多言，用了就知道。

3.1 将 Hexo 项目导入 Obsidian

这一步很简单，打开 Obsidian 后，它会默认打开上次的存储库，这个时候你需要点击左下角的 打开其他库 icon 来调出欢迎面板：

然后在欢迎面板打开你的 Hexo 项目即可：

由于 hexo 的文章只存在于 source 目录下，我们需要让 Obsidian 忽略其他文件的内容以优化性能以及减少不必要的搜索结果。具体的操作是在 设置-文件与链接-Exclude Files，将需要忽略的文件添加进去（尤其是 node_modules）：

同时，在你的 hexo 项目的 .gitignore 文件中加入如下内容：

.obsidian/workspace

.obsidian 文件本身是可以同步的，当前存储库的插件以及相关的配置都会下载在这个文件夹中，因此将其同步到 git 记录中也是非常有用的，假如你切换设备就不需要重新为当前的存储库重新配置 Obsidian 了。

3.2 使用 Obsidian 模板快速创建文章

Obsidian 是支持创建新文件时插入模板的，这就意味着我们可以不用重复写 Hexo 博客文的 Front-matter 部分。

Front-matter 是文件最上方以 --- 分隔的区域，用于指定个别文件的变量，举例来说：

---
title: Hello World
date: 2013/7/13 20:46:25
---

首先我们要创建模板，我们可以在 source 目录下创建 _obsidian 文件夹，并创建一篇 Post Template 的文章（md文件），内容为：

---
title: {{title}}
date: {{date}}
tags: []
---

然后进入到 Obsidian 的设置面板，选择『核心插件』，并启用『模板』功能。同时点击旁边的配置按钮，进入到模板配置的设置中，将配置信息设置为：

之后，我们再创建新文章的时候，只需要点击侧边栏的『插入模板』按钮就可以快速生成 Front-matter 信息：

3.3 使用 Obsidian Git 插件

我们将 Hexo 项目导入到 Obsidian 之后就可以写作了，但是当写作完成之后还面临着提交代码、推送代码到 Github 上这一操作。如果我们在用额外的终端来进行这些操作的话就太割裂了，因此我们可以使用 Obsidian Git 插件来在 Obsidian 内就可以实现 git commit 以及 push 的操作。

Obsidian Git 属于第三方插件，要想使用它必须在设置中关闭安全模式：

然后浏览插件库，搜索 Obsidian Git 并点击安装，安装完成之后根据自己需要的设置进行配置即可。

如果想要查看当前的工作区、暂存区，可以使用快捷键 command + p 打开命令面板，输入 open source control view 就可以打开 Git 面板了，这里的面板跟 VSCode 的面板操作类似，并且我它会自动帮你生成 commit 信息（你可以自行在 Obsidian Git 设置面板里配置默认的 commit 信息）：

当然你也可以懒得看 source control view，自己直接用 command+p 打开命令面板，分别执行 git commit 命令与 git push 即可。

3.4 使用 File Tree 插件

Obsidian 很不好的一点就是会把所有的文件都列在左侧的文件列表中，但是对于我们的 Hexo 项目写文章来说，我们只会修改 _post 目录下的文件，因此我们希望左侧的文件列表中只显示 _post 文件夹，但是目前为止 Obsidian 并没有推出类似『聚焦』到某一文件夹内的功能。

好在 Obsidian 强大的插件库中有一个 File Tree Alternative Plugin 第三方插件可以满足这一需求。按照 Obsidian Git 相同的方法去下载这个第三方插件，下载完成之后我们会发现左侧菜单出现了一个 File Tree 的 Tab 页，点击后就可以看到文件以树形的结构呈现：

我们展开 source 文件夹，并右键 _post 文件夹，选择 Focuse on Folder 后，左侧的文件列表中就只会显示 _post 文件夹中的内容了：

4. 使用 iCloud 同步

如果你是苹果系用户，完全可以通过 iCloud 将 Hexo 项目作为 Obsidian 库同步到各个设备上，让每个设备都可以通过 Obsidian 实时查看和编辑笔记。

你只需要将你的 Hexo 项目复制到 iCloud 的 Obsidian 文件夹即可，但是需要注意的一点是，你项目的 node_modules 也同步到 iCloud 上的话就太恐怖了。为了避免这一情况，我们需要将 node_modules 命名为 node_modules.nosync 这样就不会被 iCloud 同步。但是我们又需要 node_modules 来让项目正常运行，因此我们可以使用软链来创建一个 node_modules 软链到 node_modules.nosync 就能一举两得。简化成终端指令可以为：

# 重命名 node_modules
mv node_modules node_modules.nosync

# 创建 node_modules 软链
ln -s node_modules.nosync/ node_modules