利用Hexo在博客中插入本地图片（无需外链）|Zam9036博客

前言

​ 在用Hexo写博客的过程中我们往往需要在博客中插入图片。MarkDown中插入图片有两种方式：一种是使用外链，一种是使用本地图片。而如果使用外链图片，我们需要找好用的图床，以防图片链接不定时挂掉，这大大增加了写博客的时间成本。本地图片如果使用绝对路径会导致上传到Github上时链接不到，所以本文提供了一种利用本地图片的相对路径的方式来插入图片。

思考

​ 我们在启用博客主题时会发现，博客主题中的内置图片，会随hexo g指令一起部署到public文件夹，上传时也会一同上传到Github上，这就为我们保存博客中的图片提供了一种思路。

新建本地图片库

​ 查看Hexo-themes中的文件我们可以知道，主题文件的图片存在了source-img文件夹中，所以我们在这个文件夹中新建一个postimg文件夹，用于存放博客中需要保存的图片。

​ 然后我们把图片存进去，执行hexo g，会发现在public-img文件夹中也多了一个postimg文件夹，里面有我们刚刚存进去的图片。这说明Hexo在部署博客时，也将postimg部署到了博客里。同理，上传时也会将postimg一起上传到Github上，这说明利用相对路径保存图片的方法可行。

图片的相对路径

​ 我们查看主题的配置文件，发现图片的相对路径是/img/XXXXX.jpg，所以可以推算出我们刚刚保存的图片的相对路径是https://zam9036.gitee.io/img/postimg/XXXXX.jpg（其中XXXXX为文件名，.jpg为文件后缀，均可修改）

总结

​ 所以我们只需要在MarkDown中插入图片时，填写图片的相对路径，然后将图片保存到主题文件夹下的source-img-postimg就可以实现利用本地图片的相对路径的方式来插入图片。

提示

​ 在插入图片时，本地的MarkDown编辑器会找不到图片，这忽略这个问题。因为图片的相对路径在部署博客时会自动更新到public文件夹，自动更新后的相对路径才是正确的，才是可以被服务器访问的。

原创声明

​ 文章作者：Zam9036

​ 文章链接：https://zam9036.gitee.io/2019/10/27/6-Use-Hexo-to-insert-local-pictures-in-your-blog-no-external-link-required

​ 版权声明: 本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自Zam9036的博客！