Hexo图片引用问题
前言
使用Hexo创建博客很方便,但是图片的管理是一件很头痛的事情。最开始想要使用图床的方式来引用图片,但是止于图床中图片管理不易和难以寻找一个稳定的图床。后来发现了Hexo原生支持的图片引用方式,Github地址
hexo-asset-image的使用
开启post_asset_folder
在博客的_config.yml配置中将post_asset_folder置位true。
1 | post_asset_folder:true |
打开上述开关后,在使用Hexo创建新文章时会自动创建一个同名的空文件夹,与该文章相关的所有静态资源都可以放到该文件夹中,以方便在文章中直接引用。
安装hexo-asset-image插件
在Hexo目录下执行如下命令:
1 | npm install hexo-asset-image --save |
在文章中引用图片
这里直接使用相对路径引用图片:
1 | ![](测试图片.jpeg) |
插入图片测试:
可以看到,上面显示的图片生成的html中使用的是图片的绝对路径地址,而不是相对路径。
后记
本文所记述的引用图片的方式旨在解决博客图片的管理问题,和图片的引用在主页或者其他页面展示不正确的问题。
与上文记述的不同的是,Hexo3提供了新的标签插件来解决文章中资源引用的问题:
1 | {% asset_path slug %} |
笔者在尝试Hexo3的标签时出现了一些错误还未解决,因此暂不演示该种方式来引用图片。