hexo 使用自定义脚本，在渲染前检查图片链接

前篇：hexo 自定义 js 脚本

我平时都是在 typora 里面写好文章内容，完成之后，再到 hexo 新建文章，然后将之前写好的内容复制粘贴过来。

但是图片的链接会发生变化，例如原本的链接是 ‘img/2023/mac-shortcut-key.webp’，复制后就变成了 ‘../../../Nutstore Files/markdown/img/2023/mac-shortcut-key.webp’ 这样的链接。想要让 hexo 渲染后能正常显示，需要把它变成 ‘/img/2023/mac-shortcut-key.webp’

所以我之前都是手动修改图片链接的。如果文章中就一两张图，我就使用鼠标滑动选中，再删除。如果图片比较多，那就查找替换，也就几秒能搞定。

但这种机械重复的操作，肯定还是用代码来处理比较好。

我猜想应该也有其他人，也有同样的困扰吧。之后我在插件中心 Plugins | Hexo，搜索一下 img，我找到了这个项目：cocowool/hexo-image-link: 当MD中引用本地文件时，处理生成的html中的图片链接

查看他的代码，我发现里面使用了 before_post_render 这个参数。

处理的过程就是在渲染之前，查找一下图片链接，再处理图片链接。

于是我参考他的代码，最后达到了我的目的。这样会在渲染时，检查文章中所有的图片链接，如果发现有 ../../../Nutstore Files/markdown，就将这个前缀去掉，但是不会修改源文件。我们的 md 文件还是原来的样子。

hexo.extend.filter.register('before_post_render', function(data){
    const str = '../../../Nutstore Files/markdown'

    data.content = data.content.replace(/!\[(.*?)\]\((.*?)\)/gi, function(match, p1, p2) {
        if (p2.includes(str)) {
            // 替换图片链接
            p2 = p2.replace(str, '');

            // 生成对应的 <img> 标签
            return `<img src="${p2}" alt="${p1}">`;
        } else {
            return match; // 返回原始的 Markdown 图片语法
        }
    });
    return data;
});

不过后来由于坚果云自动升级，图片链接的前缀已经不是 ../../../Nutstore Files/markdown 了，所以我需要修改一下脚本。可能其他人的链接也跟我不一样，只需要修改一下就行。