参考教程

主要参考:Hexo + Obsidian:解决图片无法显示问题 | andy’s blog

Obsidian配置

可选参考:如何让Obsidian的图片存储形式设置为 ./${filename}.assets

设置obsidian仓库

此方法只对一个文章仓库有效,即将hexo博客根目录同时设置为obsidian的文章根目录,方法为使用obsidian打开博客根目录(_config.yml文件所在目录,有一个source文件夹)

obsidian安装插件 Custom Attachment Location

设置→第三方插件→关闭安全模式→社区插件市场→浏览→输入Custom Attachment Location→点击安装并启动

设置 Location for New Attachments

设置为source/images/${filename}
即将粘贴在文章中的图片保存在文章根目录(也是博客根目录)下的source文件夹下的images文件夹下的一个文件夹中(以当前笔记文件名命名)

tips:
./为当前笔记所在目录,${filename}为当前笔记文件名
设置为 ./${filename} 即将图片放在当前笔记目录下的同名文件内
./assets/${filename} 将图片放在当前笔记目录下的assets目录下的同名目录(在笔记目录下设置一个assets文件夹用于存放各笔记的图片,防止同目录下笔记过多导致图片文件夹也多)笔者本来打算这样管理文章图片的,但目前并没有找到使其与hexo兼容的方法,故放弃,改用以上方法

obsidian设置文件与链接


以上配置完成后即可使图片正常在网页中显示
图片链接类似如下:
\![]\(../../images/文章名称/图片名称.png)

在博客目录下打开git终端,使用hexo s -g命令后可在http://127.0.0.1:4000/里验证图片是否显示

Hexo端配置(可选,与上文无关)

资源文件夹 | Hexo
修改 _config.yml 文件中的这个选项,这样在使用命令生成博客md文件时可以生成一个同名的资源目录,用于存放同名文章使用的资产,此法也可以实现图片的显示,但似乎只有通过命令生成的才有效,且只能在/source/_posts/下保存

1
2
3
4
post_asset_folder: true  
marked: # 如果原本有就更改下面的这些选项,如果没有就添加
  prependRoot: true
  postAsset: true

该配置完成后使用hexo new post <文章名>就会在 /source/_posts/ 路径下新建 <文章名>.md 文件和同名资产文件夹,然后在obsidian中选择打开刚刚生成的md文件写作时也能成功匹配粘贴的图片。

更通用的方案

1.做好上面的hexo配置
2.安装好Custom Attachment Location插件并启用
3.插件选项Location for New Attachments设置为./${filename}
4.关闭obsidian的wiki链接(同上文设置文件与链接)

完成后便能实现在往文章粘贴图片时,将其存到文章同级的同名文件夹下,且能够在网页中正常显示(支持多层文件夹,即你的md文件位置可为myblog\source_posts\subdir1\subdir2\文章名.md,此时图片保存路径为myblog\source_posts\subdir1\subdir2\文章名\图片名.jpg)