Highlight Domyślnie Highlight js nie obsługuje składni HTML Razor, która występuje w ASP.NET MVC.
Na szczęście ktoś już rozwiązał ten problem.
http://www.namedquery.com/project/razor-language-pack-highlight-js
A ja opiszę to rozwiązanie. Gdyż na tej stronie nie mogłem znaleźć instrukcji : co trzeba zrobić krok po kroku.
Sam kod zdobyłem, wciskając F12 w Google Chrome i zabierając interesujący mnie fragment skryptu JavaScript.
Aby dodać obsługę kodu "razor", do skryptu "highlight.pack.js" trzeba dodać następujący kod JavaScript. Ja go dodałem przed deklaracją składni “objective-c”.
hljs.registerLanguage("razor", function (b) {
var a = "foreach|0 var|0 if|0 in|0 else|0 model|0 using|0 false|0true|0 null|0 int|0 for|0 double|0 decimal|0 float|0 string|0 new|0";
return { k: a, c: [{ cN: "built_in", b: "Html|Scripts|RenderBody|RenderSection|Styles" }, { cN: "comment", b: "@[*]", e: "[*]@" }, { cN: "start", b: /[@][?\\w]*/, i: /[@][{*]/ }, { cN: "string", b: '"((?!@))', e: '"', i: "\\n" }, { b: "<", e: ">", i: "</?", sL: "xml", c: [{ b: '"@', e: '"', sL: "razor" }] }] }
});
hljs.registerLanguage("objectivec", function (e) {
Do styli CSS trzeba dodać następujący styl globalny. Nie ważne, jaki styl kolorowania składni wybierzemy znak małpy określający początek wyrażenia Razor, powinien on być podkreślony na żółto.
.razor .hljs-start { background-color: yellow; color: black; }
Gdy chcemy użyć, tej składni piszemy klasę CSS "Razor".
<pre><code class="hljs razor">@model TestModel
@{
Layout = "_layout.cshtml";
ViewBag.Title = "Test";
}
</code></pre>
Oto jak użycie składni w praktyce.
@model TestModel
@{
Layout = "_layout.cshtml";
ViewBag.Title = "Test";
}
@Scripts.Render("~/bundles/vendors")
@Styles.Render("~/bundles/my")
@* Comment *@
@Html.GoogleMaps("Ziomek")
@* Multi
Line
Comment *@
@{
var test = 0;
<p>Coś tam coś tam</p>
<div>
<a href="/test/">Link</a>
</div>
}
@foreach (var test in Model) {
<p>@test.Item</p>
}
@if (true) {
<p>@test.Item</p>
} else {
<p>nope</p>
}
<p>@Html.TextBoxFor(p => p.FirstName)</p>
@Html.Action("_Aside", Model);
@using (Html.BeingForm("Index", "Home")) {
@Html.AntiForgeryToken()
@Html.TextBoxFor(p => p.LastName)
<input type="Submit" value="@if(true){><text>true</text>}" />
}
<input disabled="@model.BooleanValue" type="text" />