hugo 中的函数 replaceRE 用处很多！

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 2094 天前的主题，其中的信息可能已经有所发展或是发生改变。

偶然看到一篇博客： https://www.junian.net/hugo-image-figure-wrap/

可以用 replaceRE 把 Markdown 转换得到的 HTML 中的 img 标签变成 figure 标签：

<p><img src="https://www.example.com/image.png" alt="Alt Text" title="Title Text"></p>

变为

<figure>
  <img src="https://www.example.com/image.png" alt="Alt Text" title="Title Text">
  <figcaption>Alt Text</figcaption>
</figure>

我按它的思路，顺手改了下我博客的主题代码，可以把图片的 src 由本地地址变为图床上的地址：

src原来是ranked_results.jpg，现在是https://图床 HOST/img/blog/ReID 任务中的 CMC 和 mAP/ranked_results.jpg。省的自己在 Markdown 文件中改了。感觉蛮方便的。

上面这个功能最关键的代码是

{{ $reAltIn := "<img src=\"([^\"/]+)\" alt=\"([^\"]+)\" />" }}
{{ $reAltOut := (printf "<img src=\"%s%s$1\" alt=\"$2\">" .Site.Params.CDN.Host .Dir )}}
{{ $altContent := .Content | replaceRE $reAltIn $reAltOut | safeHTML }}

replaceRE+斟酌半天的正则=奇巧淫计

2 条回复 • 2019-03-04 11:24:06 +08:00

rayhy

2019-03-02 16:32:09 +08:00

甚至可以实现用![ALT text@200]( https://www.example.com/image.png)来指定图片的宽度为 200，就看你 replace 时怎么写了。

codehz

2019-03-04 11:24:06 +08:00 via Android

正则写得爽，修改火葬场