hexo相对路径图片显示

说明

hexo的图片默认不支持相对路径。需要配置 post_asset_folder 选项，设置从false改成true之后支持。但是要求图片目录必须和文件名相同。

由于我在typore下的markdown资源图片都是放在images目录下面，以相对路径方式引用。与hexo配置不兼容，并且我也不想去修改目录结构。因此花一天写了个hexo插件，来实现相对路径图片页面展示的功能。

这个插件的目的如下：

图片可以为hexo的_posts目录下的任意目录下的资源图片，文章内可以使用相对路径引用，在模板渲染时，插件会将相对路径的图片转为inline模式，以base64编码直接在html内引用。这样就不会出现目录问题。

使用方式

1. 安装插件：

安装命令如下

npm i hexo-filter-inline-image

2. 配置hexo启用插件

_config.yml 增加以下配置

inline_image:  
    enabled: true
    compress: false
    remote: false
    limit: 2048

compress 是否启用图片压缩
remote 是否转换http和https图片,默认关闭
limit 限制图片大小（kb）在此以内才会进行转换

注意：

由于本身Hexo带有缓存会导致插件第一次使用可能会出现无效果，请使用hexo clean清除缓存后即可正常使用

源码

https://github.com/shawnxt/hexo-filter-inline-image.git