Расширение Showlight Highlightjs

Я пытаюсь написать редактор уценки в AngularJS. Я использую angular-markdown (оболочку AngularJS Showdown) для анализа уценки, и я хотел бы выделить фрагменты кода, используя highlightjs. Я написал следующее расширение Showdown:

/* global
    hljs,
    Showdown
*/

(function() {
    'use strict';

    Showdown.extensions.hljs = function(converter) {
        return [
            {
                type: 'lang',
                filter: function(text) {
                    return text;
                    var m = /([`]{3}[\S\s]*[`]{3})/gm.exec(text);
                    if(!m) {
                        return text;
                    }
                    for(var i in m) {
                        if(isNaN(i)) {
                            continue
                        }
                        var match = m[i];
                        var lang = match.replace(
                            /([`]{3})([\s\S]*)(\n){1}([\s\S]*)([`]{3})/gm,
                            '$2');
                        var code = match.replace(
                            /([`]{3})([\S\n]*)(\n){1}([\s\S]*)([`]{3})/gm,
                            '$4');
                        var hl;
                        try {
                            var hl = hljs.highlight(lang, code);
                        } catch(e) {
                            var hl = hljs.highlightAuto(code);
                        }
                        text = text.replace(match, '<pre>' + hl.value + '</pre>');
                    }
                    return text;
                }
            }
        ];
    };
}());

Это пока не работает идеально. Текст, который идет после первого фрагмента кода, также вложен и выделен.

Я создал plunkr здесь. Соответствующий код находится в js/angular-markdown-hljs.js,

Мой вопрос: как я могу заставить это работать?

1 ответ

Создать расширение для подсветки кода с помощью https://highlightjs.org/ было бы довольно просто с помощью расширенного движка RegExp нового шоудауна.

Вот пример кода для последней разборки.

showdown.extension('codehighlight', function() {
  function htmlunencode(text) {
    return (
      text
        .replace(/&amp;/g, '&')
        .replace(/&lt;/g, '<')
        .replace(/&gt;/g, '>')
      );
  }
  return [
    {
      type: 'output',
      filter: function (text, converter, options) {
        // use new shodown's regexp engine to conditionally parse codeblocks
        var left  = '<pre><code\\b[^>]*>',
            right = '</code></pre>',
            flags = 'g',
            replacement = function (wholeMatch, match, left, right) {
              // unescape match to prevent double escaping
              match = htmlunencode(match);
              return left + hljs.highlightAuto(match).value + right;
            };
        return showdown.helper.replaceRecursiveRegExp(text, replacement, left, right, flags);
      }
    }
  ];
});
Другие вопросы по тегам