Slim 模板 - 删除块标记周围的空格

Slim templates - removing whitespaces around the block tag

我正在新项目中尝试使用 Slim 模板(在使用 Haml 一段时间后)。虽然整体体验很棒,但我遇到了一个问题,即通常使用 display: block

的标签周围总是插入空格

说,

ul.ampm
  li.am am
  li.pm pm

生成

<ul class="ampm">
  <li class="am">
    am
  </li>
  <li class="pm">
    pm
  </li>
</ul>

.ampm
  span.am am
  span.pm pm

生成

<div class="ampm">
  <span class="am">am</span></span class="pm">pm</span>
</div>

通常这不是什么大问题,但我们使用将 display: inline-block 应用于 li 标签的响应式布局;显然,它们之间有空格会破坏布局。

我知道

Slim::Engine.options[:pretty] = true

选项(打开它会删除有问题的空格),但它会使所有生成的源代码难以阅读,而不仅仅是我想修复的部分。

Slim 中的

<> 似乎与我需要的相反 - 它们旨在用于在内联标签周围添加空格。

所以...

非常感谢。

我通过在关键位置恢复 inline HTML 来解决这个问题。对我来说,它是将 options 的集合添加到 select:

select
  - my_collection.each do |item|
  <option value="#{item.id}">#{item.name}</option>

在少数情况下我可以忍受它真正重要(就像在 option 元素中对我所做的那样)。但是,如果您需要在整个代码中使用更好的空白,我认为您就不走运了。

is it a fundamental Slim restriction ("by design") or something which is on the roadmap and would be potentially implemented in the future?

对于这两个,我都选择 "no"。看起来 Slim 团队只是实现了一个朴素的算法,并没有回头看。举个例子,this quote from the GitHub issue tracker:

The pretty renderer is not working well under some circumstances since Slim's focus lies on performance. If you have time please provide patches for the pretty renderer of the temple project https://github.com/judofyr/temple and also provide test cases.