URL 默认

提供 url 过滤器来修复和解析 URL。

配置参数

names object

The url helper name

这个插件提供了 url 和 htmlUrl 过滤器来修复页面和布局中的页面 URL。

这个插件默认安装。🎉

url 过滤器使用你在 _config.js 中配置的 location 值来规范化单个路径。如果你的网站在子目录中，或者你想生成绝对 URL，它会很有用。

<a href="{{ '/about-us' |> url }}">

<!-- 完整 URL -->
<a href="{{ '/about-us' |> url(true) }}">

Tip

如果你不想在所有地方都使用这个过滤器，你可能会对 Base path plugin 感兴趣。

使用字符 ~ 来使用源文件名而不是最终的 URL。插件会自动为你检测最终的 URL。这对于动态 URL 以及在页面 URL 更改时自动更新指向该页面的所有链接非常有用。例如：

<a href="{{ '~/about-us.md' |> url }}">

<!-- 将被转换为 -->
<a href="/about-us/">

一些源文件可以生成多个页面。你可以在文件名后包含一个查询来选择由源文件生成的特定页面。例如：

<a href="{{ '~/about-us.page.js(lang=en)' |> url }}">

<!-- 将被转换为 -->
<a href="/en/about-us/">

在前面的例子中，(lang=en) 查询选择了 lang 变量设置为 en 的页面，该页面是在 about-us.page.js 文件生成的所有页面中。

这个过滤器类似于 url，但它作用于 HTML 代码：它搜索并规范化在 href 和 src 属性中找到的所有 URL：

---
text: 'Go to <a href="/">Homepage</a>'
---
<div>{{ text | htmlUrl | safe }}</div>

作为一种良好的 SEO 实践，你可以考虑在你的 <head> 部分（例如，在 base.vto 模板中）添加一个规范 URL，像这样：

<link rel="canonical" href="{{ url |> url(true) }}">