Отображение тегов C# ‹summary› на страницах Jekyll Github с использованием Highlight.js

Чтобы успешно отображать коды с помощью простого HTML, я добавил Highlight.js в моем блоге на основе Jekyll, который работает на страницы 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?

Вопрос:

Как разработчику убедиться, что все между <pre> <code class="csharp"> и </code> </pre>, включая этот <summary> отображается с помощью Highlight.js в таких сценариях?


javascript jekyll c# github-pages highlight
person Zameer Ansari    schedule 30.12.2015    source источник

Ответы (2)


arrow_upward
3
arrow_downward

code тег HTML использует Фразовое содержание, что означает, что он будет обрабатывать обычные теги HTML, такие как <summary> как обычный HTML-код, поэтому вывод не выполняется.

Чтобы избежать этой проблемы, вам нужно правильно кодировать все теги:

<pre>
<code class="csharp">

    /// &lt;summary&gt;
    /// Summary description for the function or property goes here
    /// &lt;/summary&gt;

</code>
</pre>
person Fabio Poloni    schedule 30.12.2015
comment
Это было прекрасно и полезно. Спасибо! - person Zameer Ansari; 30.12.2015

arrow_upward
7
arrow_downward

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 находятся здесь.

person David Jacquel    schedule 30.12.2015
comment
+3 это круто! Меня больше беспокоит сервер, чем клиент;) - person Zameer Ansari; 31.12.2015