Gulp 如何在构建时设置外部链接的格式？

j9per5c4 于 2022-12-08 发布在 Gulp

关注(0)|答案(3)|浏览(148)

我有一个雨果网站与一些JavaScript和Gulp。
我想自动检测和格式化<a>链接，以便添加“外部链接”图标和“target=_blank”。
现在，我在客户端浏览器中使用一些JavaScript：

// EXTERNAL LINKS
$(document.links).filter(function() {
  return this.hostname != window.location.hostname
      && this.hostname != "domain-name-base-url.com"
      && this.hostname != "another-domain-name-base-url-to-be-treated-as-internal.com"
}).attr('target', '_blank').addClass("external");

但出于性能原因，我希望在构建时执行此操作。
我如何将其移到构建后的gulp任务中？我尝试了.pipe(replace...)的一些功能，但无法完成。我甚至可以在Hugo构建时完成它吗？
如果有人知道一个更简单的方法来实现这一点（允许用户输入Markdown，忘记一个链接是否是外部的，并在构建时添加'target=_blank'和一个图标）...任何神奇的库或最佳实践？

gulp

来源：https://stackoverflow.com/questions/56819003/how-to-format-external-links-at-build-time

3条答案

按热度按时间

tyu7yeag1#

您可以简单地手动替换任何外部链接，而不是花时间尝试开发解决方案。
对于Markdown 2.5.2，您可以使用以下语法

[link](url){:target="_blank"}

如果这不起作用，就使用常规HTML

<a href="http://example.com/" target="_blank">Hello, world!</a>

有关Hugo内部和外部链接的更多信息，请访问here。

赞(0）回复(0）举报 2022-12-08

svujldwt2#

**Update：**您也可以在模板中执行此操作，方法是使用replace函数将该属性添加到所有锚元素中：

{{ $content := replace .Content "<a " "<a target=\"_blank\" " | safeHTML }}
{{ $content }}

你可以配置Blackfriday，Hugo的减价处理器，通过在config.toml文件的底部添加以下代码来打开新标签页中的链接：

[blackfriday]
  hrefTargetBlank = true

从Blackfriday期权文档中：
hrefTargetBlank
默认值：false
黑色星期五旗帜：HTML_HREF_TARGET_BLANK
目的：true打开（外部链接）绝对链接在新窗口或标签页中。虽然target="_blank"属性通常用于外部链接，但Blackfriday会对所有绝对链接执行此操作（ref）。如果他们始终使用绝对链接，则需要注意这一点，对于内部链接也是如此（例如，通过将canonifyURLs设置为true或通过absURL）。

赞(0）回复(0）举报 2022-12-08

lyr7nygr3#

Hugo拥有Markdown渲染挂钩所需的一切：https://gohugo.io/getting-started/configuration-markup/#markdown-render-hooks
雨果教程外部链接：
创建布局/_默认/_标记/渲染链接. html

{{- $parsedTitle := dict -}}
{{- with .Title -}}
  {{- $parsedTitle = partial "functions/parse-title-attribute.html" . -}}
{{- end -}}
{{- $baseurl := urls.Parse .Page.Site.BaseURL -}}
{{- $desturl := urls.Parse .Destination -}}

<a href="{{ .Destination | safeURL }}"
  {{- with $parsedTitle.title }} title="{{ . }}"{{- end -}}
  {{- with $parsedTitle.attributes -}}
    {{- range $k, $v := . -}}
      {{- printf " %s=%q" $k $v | safeHTMLAttr -}}
    {{- end -}}
  {{- end -}}
  {{- if and (strings.HasPrefix .Destination "http") (not (strings.HasPrefix $desturl.Host $baseurl.Host)) }} target="_blank" rel="external nofollow noopener"{{ end -}}
  >{{ .Text | safeHTML }}</a>

{{- /* Strip trailing space. Code by djibe, thanks to jmooring & killbus */ -}}

现在您有两种可能性：

用于减价：[External link](https://discourse.gohugo.io/ "{rel='nofollow'}")（但是，除非您删除{{- if and (strings.HasPrefix .Destination "http") (not (strings.HasPrefix $desturl.Host $baseurl.Host)) }} target="_blank" rel="external nofollow noopener"{{ end -}}行，否则所有外部链接都将标记为external nofollow）
或标准[External link](https://discourse.gohugo.io/)

注：短代码不受此影响，因此您必须在每个链接上指定适当的行为。

赞(0）回复(0）举报 2022-12-08

我来回答

Gulp 如何在构建时设置外部链接的格式？

3条答案

相关问题

热门标签

最新问答