如何删除突出显示jekyll中不必要的缩进和折行 [英] How to remove unnecessary indent and break line in highlight jekyll

问题描述

我将jekyll code highlight与gem rouge一起使用.

I use jekyll code highlight with gem rouge.

模板-Jekyll•简单，可识别博客的静态网站

---
layout: default
---

<div class="container-fluid">
  <div class="row">
    <div class="col-sm-2" style="background-color:red;">
      {% highlight ruby %}
      def hoge
        puts 'red'
      end
      {% endhighlight %}
    </div>
    <div class="col-sm-8" style="background-color:blue;">
      {% highlight ruby %}
      def foo
        puts 'blue'
      end
      {% endhighlight %}
    </div>
    <div class="col-sm-2" style="background-color:yellow;">
      {% highlight ruby %}
def bar
  puts 'yellow'
end
      {% endhighlight %}
    </div>
  </div>
</div>

结果

https://github.com/shingo-nakanishi/jekyll-dojo /tree/ca564cd5653e7ee028cd30b87c04a6076f078693

      {% highlight ruby %}
def bar
  puts 'yellow'
end
      {% endhighlight %}

是否不必要的缩进消失了.但无法读取的html代码.不必要的中断线没有消失.

is the unnecessary indent was gone. but unreadable html code. the unnecessary break line not gone.

如何删除它们?

推荐答案

换行符和额外的缩进将保留在highlight标记内-类似于默认情况下如何显示HTML pre标记内的文本.修剪第一行换行符，但保留最后的换行符，因为它后面是空格.

The newlines and extra indentation are being preserved inside the highlight tags - similar to how text inside an HTML pre tag is displayed by default. The first newline is trimmed, but the final newline is preserved since it is followed by whitespace.

这会产生所需的输出，但要以源代码缩进为代价:

This produces the output you want, at the cost of source indentation:

<div class="container-fluid">
  <div class="row">
    ...
    <div class="col-sm-2" style="background-color:yellow;">
{% highlight ruby %}
def bar
  puts 'yellow'
end
{% endhighlight %}
    </div>
  </div>
</div>

或者，您可以捕获标记上方的输出以保持源缩进:

Alternatively, you could capture the output above your markup to keep your source indentation:

{% capture code %}
def bar
  puts 'yellow'
end
{% endcapture %}

<div class="container-fluid">
  <div class="row">
    ...
    <div class="col-sm-2" style="background-color:yellow;">
      {% highlight ruby %}{{ code }}{% endhighlight %}
    </div>
  </div>
</div>

这篇关于如何删除突出显示jekyll中不必要的缩进和折行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！