显示C#<摘要>使用Highlight.js的Jekyll Github页面中的标记

Showing C# <summary> tags in Jekyll Github pages using Highlight.js

本文关键字：Github Jekyll Highlight lt 摘要 gt 显示 使用 js      更新时间：2023-09-26

为了用简单的HTML成功地显示代码，我在基于Jekyll的博客中添加了Highlight.js，该博客运行在Github页面上

<!--Add Highlight.js https://highlightjs.org/download/ -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.0.0/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.0.0/highlight.min.js"></script>
<!-- Using Highight.js https://highlightjs.org/usage/-->
<script>
  hljs.initHighlightingOnLoad();
</script>

我需要显示以下C#代码，即<pre> <code class="csharp">和</code> </pre>之间的所有内容：

<pre>
<code class="csharp">
/// <summary>
/// Main class of the project
/// </summary>
class Program
{
    /// <summary>
    /// Main entry point of the program
    /// </summary>
    /// <param name="args">Command line args</param>
    static void Main(string[] args)
    {
        //Do stuff
    }
}
</code>
</pre>

此代码添加在此显示的.md文件中。

除<summary>标记外，所有内容都在渲染中荧光笔是否将其误解为普通HTML

问题：

在这种情况下，开发人员如何确保使用Highlight.js显示<pre> <code class="csharp">和</code> </pre>之间的所有内容，包括<summary>标记？

Jekyll板载有高亮标记和css（_sass/_syntax-highlighting.scss）。

{% highlight csharp %}
/// <summary>
/// Main class of the project
/// </summary>
class Program
{
    /// <summary>
    /// Main entry point of the program
    /// </summary>
    /// <param name="args">Command line args</param>
    static void Main(string[] args)
    {
        //Do stuff
    }
}
{% endhighlight %}

这是开箱即用的，不需要客户端过载。所有可用的Pygment lexer都在这里。

code HTML标记使用短语内容，这意味着它将把<summary>等常规HTML标记视为常规HTML代码，因此省略输出。

为了避免这个问题，你必须正确编码所有标签：

<pre>
<code class="csharp">
    /// &lt;summary&gt;
    /// Summary description for the function or property goes here
    /// &lt;/summary&gt;
</code>
</pre>
相关文章：