javascript - 如何在 Handlebars 模板中使用 metalsmith-permalinks

Question

我已设置集合并正常工作。

我正在遍历一组项目

{{#each collections.projects}}
    <a href="" class="portfolio-entry">

        <div class="info-frame portfolio-title">
            <h4>{{this.title}}</h4>
        </div>

        <div class="info-bits centerContext">
            <ul class="centerElement">
                <li class="info-bit">{{this.skills}}</li>
                <li class="info-bit">{{this.type}}</li>
                <li class="info-bit">{{this.platform}}</li>
            </ul>
        </div>

        <div class="project-thumbnail">
            <img src="{{this.thumbnail}}" alt="">
        </div>

    </a>
{{/each}}

我想使用 metalsmith-permalinks 来解析每个链接的 url

我试过各种像这样蹩脚的东西

<a href="{{this.permalink}}" class="portfolio-entry">

还有这个

<a href="{{this.url}}" class="portfolio-entry">

当然 - 它们都不起作用。

我很难找到任何关于如何在网上任何地方实际使用模板中的永久链接的详细信息。

Answer 1

永久链接插件添加了似乎没有很好记录的 path 元数据属性。这应该是您实现链接所需要的。

Github page备注:

If no pattern is provided, the files won't be remapped, but the path metadata key will still be set, so that you can use it for outputting links to files in the template.

我还没有在其他任何地方找到它的用法，但我认为上面的引述意味着它是标准行为。

你可以像这样使用它:

{{#each collections.projects}}
    <a href="/{{this.path}}/" class="portfolio-entry">

第一个 / 是为了解析到当前主机，尾随的 / 是可选的(取决于您的 http 服务器配置。