1.使用图床#

这可能是大多数人选择的方式。把图片上传到图床，直接用 [](图片链接) 引用。很方便，但是图床可能会跑路，比较不稳定，还是放在自己服务器上好。反正cloudflare带宽无限

2. 相对路径引用的标签插件#

Hexo 3 的更新带来了许多标签插件，可以用

1
{% asset_img example.jpg This is an example image %}
2
{% asset_img "spaced asset.jpg" "spaced title" %}

来引用资源文件夹的图片。

确实是种方法，但只能在 Hexo 中使用。

3.使用 Markdown 嵌入图片#

我选择这种方式。

先安装 hexo-renderer-marked 插件：

1
npm install hexo-renderer-marked --save

1
pnpm add hexo-renderer-marked

1
yarn add hexo-renderer-marked

在 _config.yml 中写入：

1
post_asset_folder: true
2
marked:
3
  prependRoot: true
4
  postAsset: true

这样你就可以直接通过 ![](example.jpg) 直接引用文章资源文件夹的图片了（博客根目录/source/_post/文章文件名/example.jpg）。

假设 Hexo 三连后 image.jpg 的位置为 /2026/07/05/foo/image.jpg ，这表示它是 /2026/07/05/foo/ 文章的一张资源图片，![](image.jpg) 将会被解析为 <img src="/2020/01/02/foo/image.jpg">。

舒服！但是，这有一个问题。

1. 使用图床#

和上面一样，不多说了。直接写图片链接。

2. 根据permalink计算实际路径#

Permalink 是啥？

默认配置是 permalink: :year/:month/:day/:title/

假设你的 foo 文章的图片 image.jpg 在三连后的位置是 /2026/07/05/foo/image.jpg ，那么在 cover 字段你应该写的路径是 /2026/07/05/foo/image.jpg。

每次都这么算，太麻烦了，怎么办？

3. 使用脚本#

不知道是我的问题还是必应的问题，我一直都没有搜到很合适的方法。

Vibe Coding 启动！‘梁圣真是大善人’

通过我与 Deepseek 10 分钟的交流，也是成功写了个脚本，放在 博客根目录/scripts/cover-path.js。

WARNING

以下代码由 DeepSeek 编写

1
hexo.extend.filter.register('before_post_render', function(data) {
2
  if (data.cover && !data.cover.startsWith('http') && !data.cover.startsWith('/')) {
3
    // data.path 例如 "2026/07/05/foo/index.html"
4
    let dir = data.path.replace(/\/index\.html$/, '').replace(/\.html$/, '');
5
    if (!dir.endsWith('/')) dir += '/';
6
    data.cover = '/' + dir + data.cover;
7
    console.log(`[转换] ${data.title} -> ${data.cover}`);
8
  }
9
  return data;
10
});

第一行的

1
hexo.extend.filter.register('before_post_render', function(data) {

表示向 Hexo 注册一个过滤器，在文章渲染前执行。在文章渲染前，这个脚本会读取 cover 字段和文章路径，如果 cover 字段不是 http 或 / 开头，就将你本来写的 image.jpg 转换为 /2026/07/05/foo/image.jpg。

不用自己算了，太方便了。以后直接写封面文件名就行了。