如何删除 Liquid 的 `{% include ... %}` 添加的空格

Question

我正在使用 Liquid {% include ... %} inline 在我的页面上插入标记。这样做会导致在包含之后立即添加 whitespace，我无法将其删除。我附上了输出和标记的屏幕截图以供参考。

标记

输出

span.html

<span>{{ include.content }}</span>

anchor.html

<a>{{ include.content }}</a>

{% include ... %} 文件前后均未包含任何白色 space。我尝试在包含本身上使用 {%- -%} 并在包含文件中使用 {{- -}}，但无济于事。

关于如何处理这个问题有什么建议吗？

Answer 1

确保您的包含中没有换行符。 IE。 span.html 末尾没有空行。 include 中的任何换行符都会成为输出中的换行符，浏览器将其呈现为白色 space.

如果您必须在 include 中有换行符以提高可读性（例如，如果您正在执行 Liquid 循环），您可以捕获其内容，然后使用过滤器从结果中删除换行符，如下所示：

{% capture span %}
<span>
    {{ include.content }}
</span>
{% endcapture %}{{ span | strip_newlines }}

同样，包含的末尾不能有空行。

Answer 2

原来罪魁祸首是我的文本编辑器 ATOM。默认情况下安装并启用了一个名为 whitespace 的软件包。包裹的描述是：

Strips trailing whitespace and adds a trailing newline when an editor is saved.

我已经禁用了包，重新保存了我的包含，现在一切正常。

How to remove whitespace added by Liquid's `{% include ... %}`