如何使用 Eleventy 的灰质节选？

Posted 2023-03-08

【中文标题】如何使用 Eleventy 的灰质节选？

【英文标题】：How do I use an excerpt from Eleventy's gray-matter?

【发布时间】：2020-11-21 18:15:21

【问题描述】：

目标：为 Eleventy 博客的帖子列表中的每个帖子显示帖子摘录

我正在将this starter project 改编为我自己的博客。 我指的是this Eleventy document 获取帖子摘录。

我的代码：

根据上述文档，我首先编辑我的 .eleventy.js 以启用灰质摘录，如下所示：

module.exports = function(eleventyConfig) 
  eleventyConfig.addPlugin(pluginRss);
  eleventyConfig.addPlugin(pluginSyntaxHighlight);
  eleventyConfig.addPlugin(pluginNavigation);

  eleventyConfig.setDataDeepMerge(true);
  eleventyConfig.setFrontMatterParsingOptions( excerpt: true
                                              );
  /* file continues below */

接下来，根据示例，我在一些博文的第一段之后添加了“---”。

最后，我更新了 /_includes/postslist.njk 以包含对每篇文章摘录的引用，因此我的新文件现在显示为：

<ol reversed class="postlist" style="counter-reset: start-from  (postslistCounter or postslist.length) + 1 ">
% for post in postslist | reverse %
  <li class="postlist-item% if post.url == url % postlist-item-active% endif %">
    <a href=" post.url | url " class="postlist-link">% if post.data.title % post.data.title % else %<code> post.url </code>% endif %</a>
    <time class="postlist-date" datetime=" post.date | htmlDateString "> post.date | htmlDateString </time>
    % for tag in post.data.tags %
      %- if collections.tagList.indexOf(tag) != -1 -%
      % set tagUrl %/tags/ tag /% endset %
      <a href=" tagUrl | url " class="tag"> tag </a>
      %- endif -%
    % endfor %
    %- if post.excerpt -%
        <p> post.excerpt </p>
    %- endif -%
  </li>
% endfor %
</ol>

但没有出现摘录。

我的尝试

我检查了输出 HTML 中的空段落标签，但它们不存在，所以 if 条件本身失败。

我尝试将摘录分隔符设置为默认值以外的其他内容 “---”，结果相同。

重要的是，我尝试禁用 .eleventy.js 中的摘录，这会导致分隔符 被阅读为常规降价。这很重要，因为它表明灰质是正确的 阅读我在博客文章中的分隔符作为分隔符，因此问题一定出在我的 /_includes/postslist.njk.

结论

如何引用 Eleventy 从灰质生成的摘录？

（P.S.：我没有足够的声誉来为 gray-matter npm 包创建 *** 标记，但恕我直言，如果有人想这样做，那也不是一个坏主意。我已将其标记为 yaml-front-matter，这并非完全不准确，但据我所知，我的问题很漂亮 特定于 yaml 前端的 gray-matter 方言。 )

【问题讨论】：

更多信息：gitlab.com/webbureaucrat/webbureaucrat.gitlab.io提供完整源代码

【参考方案1】：

根据文档，十一使摘录在page 变量下可用（请参阅Eleventy supplied data），而不是作为集合项的“***”属性。 page 变量是集合项的data 对象的一部分。如果您使用post.data.page.excerpt 而不是post.excerpt，它将按预期工作：

%- if post.data.page.excerpt -%
    <p> post.data.page.excerpt </p>
%- endif -%

或者，您可以使用excerpt_alias option 将摘录作为***属性提供。使用此配置，您的模板将按原样工作：

eleventyConfig.setFrontMatterParsingOptions(
    excerpt: true,
    excerpt_alias: 'excerpt',
);

【讨论】：

为努力而投票，特别是对于我没有看到的页面变量信息页面，但不幸的是，我无法让任何一个配置工作。我在这里分叉了一个最小的例子：gitlab.com/eleanorofs/excerpt-example

@EleanorHolley 对不起，我搞砸了第一个例子。你需要post.data.page.excerpt 而不是post.page.excerpt。我已经在示例代码中更正了这一点。在您的最小示例中，您将eleventyConfig.setFrontMatterParsingOptions 调用inside 放在tagList 集合的回调中，这可能是其他选项不起作用的原因。如果你把它移到回调之外它应该可以工作！

@EleanorHolley 随着此补丁中的更改，摘录在您的最小示例中为我工作：gist.github.com/MoritzLost/50317d240101c870f41e035281dad51b