4

在 GitHub 或 BitBucket 中每个存储库的主页上,它以非常漂亮的格式显示 Readme.md。

有没有办法用红宝石做同样的事情?我已经找到了一些像Redcarpet这样的宝石,但它看起来并不漂亮。我已按照Redcarpet 的说明进行操作。

编辑:在我尝试了Github 的标记 ruby​​ gem之后,同样的事情正在发生。显示的是这样的: 在此处输入图像描述 而我想要的是这样的: 在此处输入图像描述

而且我确信它不仅缺少 css,因为在 3 个反引号 (```) 之后,我编写了类似jsonor的语法,bash并且在第一张图像中它被写入了。

编辑2:

这段代码在这里:

  renderer = Redcarpet::Render::HTML.new(prettify: true)
  markdown = Redcarpet::Markdown.new(renderer, fenced_code_blocks: true)
  html = markdown.render(source_text)
  '<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>'+html

生成了这个: 在此处输入图像描述

4

2 回答 2

2

Github 提供了自己的 ruby​​ gem 来执行此操作:https ://github.com/github/markup 。您只需要安装正确的依赖项就可以了。

于 2018-02-20T13:06:57.267 回答
0

您需要启用一些非标准功能。

围栏代码块

Fenced 代码块是非标准的,并且在大多数 Markdown 解析器上默认不启用(一些较旧的解析器根本不支持它们)。根据 Redcarpet's docs,您要启用fenced_code_blocks扩展:

  • :fenced_code_blocks:解析围栏代码块,PHP-Markdown 风格。以 3 个或更多或反引号分隔的块~将被视为代码,无需缩进。可以在代码块的开放栅栏的末尾添加一个可选的语言名称。

语法高亮

大多数 Markdown 解析器不做代码块的语法高亮。而那些这样做的人总是将其作为一种选择。即使这样,您仍然需要提供自己的 CSS 样式来正确设置代码块的样式。事实证明,Redcarpet 确实包含对渲染器prettify选项的支持:HTML

  • :prettify:将漂亮打印类添加到<code>google-code-prettify 的标签。

您需要从google-code-prettify项目中获取 Javascript 和 CSS 以包含在您的页面中。

解决方案

最后你需要这样的东西:

renderer = Redcarpet::Render::HTML.new(prettify: true)
markdown = Redcarpet::Markdown.new(renderer, fenced_code_blocks: true)
html = markdown.render(source_text)
于 2018-02-20T20:31:05.413 回答