obsidian+hexo笔记流

# 最终效果

用 obsidian 写笔记并在 obsidian 内进行 hexo 文件的上传，上传后的网页可以渲染复制粘贴到 obsidian 的图片（比如刷网课时上的截图等等），不需要自己调整图片的格式。

附：笔者主题：shoka，GitHubpages 部署，理论上，这套方法兼容所有 hexo 主题且可以迁移应用于 hugo

# 前言

作为一个 obsidian 的重度使用者，如何把 hexo 和 obsidian 结合起来写笔记一直是我在思考的点，在过去我要写一篇笔记到 hexo 上，我需要下面几个步骤：

在hexo创建md文件——hexo new ... -> 在obsidian写好笔记 -> 复制笔记到md文件上 -> hexo clean，hexo generate，hexo deploy

这太不自然了，我还要复制 obsidian 里面的 md 文件的内容过去，还要手动加上标签和分类那几个 matedate（如果你写过 hexo 文章，就知道这个是什么），很麻烦。

更要命的是什么？是你的 obsidian 上渲染的图片是无法在 hexo 上渲染出来的！

比如说，我在 obsidian 粘贴了一张图片，这个图片会被 obsidian 专门放到一个文件夹下，在你的笔记上，这个图片对应的文本是这样的 ![[ ... ]]

所以为什么会渲染不出来呢？第一 hexo 不支持渲染 ![[ ... ]] 的图片格式，另外你的图片在你的 obsidian 仓库本地，你没搬上 hexo 文件夹上。

于是我开始了我的思考

# 我的探索（只想看解决方案跳过这部分）

# 回合一（直接调整）

我想到的第一个方案是把图片挪到对应的 hexo 里面的 md 文件的同一个文件夹下面，在 md 文件（以下统一为 hexo 源文件下的 md 文件）上手动调整图片的格式，给图片写一个相对位置。我有一篇笔记就是这样渲染上去的

二分查找

但是你应该很容易察觉这种方法对于一个追求效率和自动化的人是无法接受的，图片一旦开始多起来，人绝对会疯掉的，而且对于一个计算机学生来说，这个方法是不是太蠢了😅。

# 回合二（“曲线救国”）

要是这么麻烦，我为什么不直接用现成的带有 markdown 编辑支持功能的平台，于是我直接弃用了 hexo，直接换用了知乎来写笔记，但是问题依旧存在，我在 obsidian 的笔记上的图片还是很难迁移到知乎上，只是知乎的话，我可以直接导入 markdown 文件，但是知乎对 md 文件的支持，懂的都懂，经常导入进去后直接就乱位了，而且渲染出来也不好看，有一些格式还渲染不出来，只能算是勉强能用，知乎的好处也很明显，比起 hexo 有流量，手机也可以发布文章，等等。但是关键问题还是没有解决，图片怎么办？

这对于其他的平台也是合理的，比如 halo，mkdocs，其实我觉得 mkdocs 还挺不错的，但是实在没有找到喜欢的主题，由奢入简难啊。

那有没有办法把这些都实现自动化的办法呢？

有的兄弟，有的☝️🤓✌️

# 解决方案

要解决这个问题，就是解决图片上传和渲染到 hexo （GitHub）的问题

# 在 hexo 源文件根目录新建 obsidian 仓库

首先，我为什么要把 obsidian 和 hexo 源文件夹分开呢？

直接在 hexo 源文件夹上新建一个仓库不就行了？

先新建一个仓库，注意把仓库建在 hexo 的根目录里

打开仓库后，我们会发现有很多不需要的文件夹，我们可以在设置里选择忽视它们，避免它们对我们的搜索功能造成影响。

点击忽略文件下面的管理按钮就可以添加需要忽略的文件了

# 实现在 obsidian 软件一键上传笔记

要实现一件上传，就需要自动化输入指令，所幸的是，obsidian 拥有巨大的插件生态，这样的插件是存在的

shell commands 就可以支持实现在 obsidian 创建快捷键来实现脚本的运行

安装 shellcommands，新建一个指令（命名为发布博客），再配置一下快捷键

这里你的命令可能会是

1
2
3

hexo c
hexo g
hexo d

在 /scaffolds 文件夹下面创建一个模板，这里需要先安装 Templater 插件

这个模板的意思是自动给 md 文件添加元属性，你就不用在命令行 hexo new (hugo new) 了，或者说你复制粘贴到一个新的 md 文件就不用手动添加

1
2
3

---
其他
---

现在你写一篇 hexo 笔记就被简化为了

obsidian内创建笔记+写标题 + alt+I插入模板 + 写笔记 + alt+P发布笔记

写笔记整个过程没有命令行还可以用上 obsidian 的强势插件

# 实现简单复制粘贴的图片也可以正确被渲染

对的，这个问题明显还没有被解决，前面只是做到了把操作简化而已。

这里我们要搞明白为什么我们复制粘贴到 obsidian 的文件是没法正确渲染到 hexo 的

如果你直接上传你复制粘贴的笔记，你应该会看到你的图片变成了下面的文字

1

![[12313.png]]

1

例如![](obsidian+hexo笔记流-20250310103733400.png)

这个还不够，因为你会发现，你还是渲染不出来图片，因为你的图片都没有被上传到 GitHub 仓库。

我对这个 hexo 上传的原理不太明白，但是如果你把图片放在了跟笔记同名的文件夹下，这个图片就可以顺利地上传到 GitHub 仓库，通过相对路径被识别到。

所有下面要配置一下你复制粘贴后的图片存储的位置

下载 Custom Attachment Location 插件

在配置中调整一下，你可以照着我的配置抄

Generated attachment filename： ${filename}-${date: YYYYMMDDHHmmssSSS}

完成这些配置之后你应该就可以快乐地结合 obsidian 和 hexo 进行写笔记了

# 关于 latex

为啥要大费力气做这个联动？

• 主要是因为要拿 obsidian 的插件 latex 去写一些公式（latex suit）
• obsidian（vim 模式）

hexo 是支持 latex 渲染的，你可以通过安装插件和添加元属性来渲染（注意我的主题 shoka 是支持的，其他主题我不太清楚）

1

math: true

这一点你可以直接看主题作者的教程 Step.4 主题特殊功能 - Theme Shoka Documentation - 二进制杂谈 - 计算机科学 | Yume Shoka = 有夢書架 = 吾乃天，壶中之天

说实话，这个主题的配置需要很强的动手能力，文档有一些细节是缺失的，不推荐第一次接触 hexo/hugo 的朋友去配置这个主题。

# 参考链接

关于我使用 obsidian 加 hexo 部署个人博客的过程 - SagiRastar's Blog

Hexo + Obsidian + Git 完美的博客部署与编辑方案 - 个人文章 - SegmentFault 思否

Step.4 主题特殊功能 - Theme Shoka Documentation - 二进制杂谈 - 计算机科学 | Yume Shoka = 有夢書架 = 吾乃天，壶中之天

# 结语

教程写得很简陋，更多在于记录自己捣鼓 hexo 和 obsidian 的过程，因为这个教程是断断续续写的，如果教程有错误的地方，请联系我。

其实可以不那么折腾的，有更简单便捷的办法去解决图片的问题，但是折腾本身还是很有乐趣的，我也知道还有其他解决方案，也许用 VScode 更好等等。

但是，我觉得这些教程的意义就是在于提供一个新的方向，告诉你这个方向是可以走通的，而不是说在不同方案下去争吵什么方法、什么工作流更好。所以最后，希望我的这套自动化的方法可以帮到你，希望你可以找到你自己喜欢的做笔记的软件或者方式🥰。