0

我使用 Jekyll 创建了我的网站，准确地说是使用 Beatiful-Jekyll 主题。对于语法高亮，我使用了 Rouge。当我不显示行号时，一切都很好。当我显示行号时，有时行号不是从第一行代码开始（最后相同，它们在结束前停止了一些行）。有时它们与代码一致，有时则不一致。

这是一个一切正常的例子：

工作正常

这是一个示例，其中行号与行代码对齐，但缺少第一行和最后一个行号（在另一个示例中，缺少前三个和最后三个）。

lines_missing

最后一个示例是行号未与行代码对齐的地方：

lines_not_aligned

我相信问题出在亚麻布上。要显示我使用的行号

{% highlight <language> linenos %}
<code>
{% endhighlight %}

因为我在 _config.yml 文件中尝试了以下配置：

kramdown:
  input: GFM
  syntax_highlighter: rouge

  syntax_highlighter_opts:
    css_class: 'highlight'
    span:
      line_numbers: false
    block:
      line_numbers: true
      start_line: 1

在这种情况下，默认显示的行号正确显示，但使用 {% highlight linenos %} 显示的行号仍然不好。

default_line_numbering_without_linenos

提前致谢

4

2 回答 2

0

我知道这是一篇旧帖子，但我很难找到答案，所以我在这里发布我的发现。

TL;DR 将 minify_html 设置为 false 并在下面使用液体缩小 html 页面。这适用于 Jekyll 版本 4.0.0

编辑 1。

进一步调查显示，代码括号内的尾随空格也会导致类似的行为。

text
text

最后一个空行在缩小 html 时打破了 pre 标记。当捕获输出 html 并将换行符转换为 br 并使用 br 标记拆分整个 html 字符串时，就会发生这种情况，因此尾随的空行会丢失。（可能会使用空格而不是空行，但我没有尝试）

结束编辑 1。

我遇到了同样的问题。我的本地“jekyll serve”服务器很好，但 Gitlab 页面显示它就像问题中的示例一样。这让我意识到我通常在本地运行站点时将“minify_html”设置为 false，事实证明，当我将 minify_html 设置为 true 时，本地版本也崩溃了。我完全删除了 jekyll default minify_html 并使用了下面的代码。

  1. 创建一个新的布局，不管你怎么称呼它。
  2. 将以下代码粘贴到其中。
{%- capture to-compress -%}
    {{ content }}
{%- endcapture -%}

{%- assign inside-code-block = false -%}
{%- capture to-remove-br -%}
    {%- assign lines = to-compress | newline_to_br | split: '<br />' -%}
    {%- for line in lines -%}

        {%- if line contains "<code>" -%}
            {%- assign inside-code-block = true -%}
        {%- elsif line contains "</code>" -%}
            {%- assign inside-code-block = false -%}
        {%- endif -%}

        {%- if inside-code-block == true -%}
            {{ line }}
        {%- else -%}
            {{ line | lstrip }}
        {%- endif -%}

    {%- endfor -%}
{%- endcapture -%}
{{ to-remove-br }}
  1. 转到您现有的布局并将您刚刚创建的布局添加到它们的前端，如下所示：
    layout: <name of the layout you made>

该代码是我缩小 html 的个人实验，它似乎有效。代码会忽略<code>标签内的所有内容，因此 ``` markdown 语法应该可以正常工作。

我在尝试使https://jch.penibelst.de/布局工作时得到了这个想法（我无法做到）。

液体语法帮助：
- https://shopify.github.io/liquid/basics/whitespace/
- https://github.com/Shopify/liquid/wiki/Liquid-for-Designers

于 2020-05-03T04:21:39.533 回答
0

我只是用这些选项遇到了这个问题：

kramdown:
  syntax_highlighter_opts:
    block:
      line_numbers: true

我使用了一个开头有空行的代码块。空行是问题所在。因为我想要空行（关于代码格式问题的帖子），我发现只需在行上放一个空格就可以解决对齐问题。

于 2021-07-18T15:29:43.613 回答