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

2023年1月16日 255次阅读

我正在尝试一个新项目中的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 to li tags;显然,它们之间有空格会破坏布局.

我知道

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

选项(并打开它确实删除了有问题的空白),但它使所有生成的源难以阅读,而不仅仅是我想要解决的部分.

<和>在Slim中似乎与我需要的相反 – 它们旨在用于在内联标签周围添加空格.

所以…

>是否有可能删除Slim中单个块标签周围的空格,类似于HAML空白食客？ (没有关闭漂亮选项的影响,那是)
>如果不是,它是一个基本的Slim限制(“设计”)或路线图上的某些东西,将来可能实施吗？

非常感激.

最佳答案 我通过在关键位置恢复到
inline HTML来解决这个问题.对我来说,它是为选择添加一组选项：

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

我可以在极少数情况下忍受这一点(正如我在选项元素中所做的那样).但如果你需要在整个代码中使用更好的whitespacing,我认为你运气不好.

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

对于这两个人,我会选择“不”.看起来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 07002 and also provide test cases.

点赞