Rouge gem 最小示例未显示格式?

Rouge gem minimal example not showing formatting?

我已按照 答案的 A) 部分中的简单说明进行操作。

代码可以在浏览器中看到,但格式不正确。

当我查看源代码时,我可以看到正在生成 css 类,但它似乎并没有改变外观。

这是生成的html(我加了div的)

<div class="highlight">
<span class="k">def</span> <span class="nf">rouge_me</span>
  <span class="nb">puts</span> <span class="s1">'hey!'</span>
<span class="k">end</span><br><br>
</div>

我试过的

  1. This 建议将所有内容包装在 <div class="highlight"> ... </div> 中,但这并没有改变任何东西。
  2. 常识说如果 css 类 在 html 中被引用,但是 css 类 没有在任何地方定义,那么它们不会被应用。当我检查我的 css 时,没有定义 类(这是一个非常基本的应用程序,没有样式)。关于类胭脂的应用'know'如何提供?胭脂是否以某种方式提供这些?

您在此处引用的说明不是使用 Rouge 格式化代码的一般说明,而是针对原始问题的特定答案。

具体来说,您错过了那里给出的一句话:“除了上面的代码之外,您唯一需要的是 CSS 规则,您已经正确地将其包含在网页中。”

的确,您需要的是包含一些 CSS 样式,这些样式将为格式化的 Rouge 输出着色。这可以通过将选定的 Rouge 主题 渲染到您的模板/布局(到 <style> 标记)或 app/assets/stylesheets/rouge.css.erb 文件中来完成,例如

<%= Rouge::Themes::Base16.mode(:light).render(scope: '.highlight') %>

the README for more examples and the list of themes