1markdown parser
2
3import showdown from 'showdown';
4import hljs from 'highlight.js';
5
6
7
8
9export function convertMarkdownToHtml(markdown: string): string {
10
11 showdown.extension("highlight", function () {
12 function htmlunencode(text: string): string {
13 return text
14 .replace(/&/g, "&")
15 .replace(/</g, "<")
16 .replace(/>/g, ">");
17 }
18 return [
19 {
20 type: "output",
21 filter: function (text: string, converter: any, options: any): string {
22 var left = "<pre><code\\b[^>]*>",
23 right = "</code></pre>",
24 flags = "g";
25 var replacement = function (
26 wholeMatch: string,
27 match: string,
28 left: string,
29 right: string,
30 ): string {
31 match = htmlunencode(match);
32 var lang = (left.match(/class=\"([^ \"]+)/) || [])[1];
33 left = left.slice(0, 18) + "hljs " + left.slice(18);
34 if (lang && hljs.getLanguage(lang)) {
35 return (
36 left + hljs.highlight(match, { language: lang }).value + right
37 );
38 } else {
39 return left + hljs.highlightAuto(match).value + right;
40 }
41 };
42 return showdown.helper.replaceRecursiveRegExp(
43 text,
44 replacement,
45 left,
46 right,
47 flags,
48 );
49 },
50 },
51 ];
52 });
53
54
55 let converter = new showdown.Converter({
56 ghCompatibleHeaderId: true,
57 simpleLineBreaks: true,
58 ghMentions: true,
59 extensions: ['highlight'],
60 tables: true
61 });
62
63 let preContent: string = `
64 <html>
65 <head>
66 <title></title>
67 <meta name="viewport" content="width=device-width, initial-scale=1">
68 <meta charset="UTF-8">
69
70 <link rel="stylesheet"node_modules/highlight.js/styles/atom-one-dark.css">
71 <script defer src="https://plausible.io/js/script.js"></script>
72 </head>
73 <body>
74 <div id=''>
75 `;
76
77 let postContent: string = `
78 </div>
79 </body>
80 </html>`;
81
82 let html: string = preContent + converter.makeHtml(markdown) + postContent;
83
84 return html;
85}
86
