不使用 PHP 标签的 ACE 静态突出显示

Question

这是使用ACE Editor的ext-static-highlight.js的例子。如何将内联选项设置为 true，以便在突出显示代码时避免使用 PHP 标记？

<script>
var highlight = ace.require("ace/ext/static_highlight")
var dom = ace.require("ace/lib/dom")
function qsa(sel) {
    return Array.apply(null, document.querySelectorAll(sel));
}

qsa(".code").forEach(function (codeEl) {
    highlight(codeEl, {
        mode: codeEl.getAttribute("ace-mode"),
        theme: codeEl.getAttribute("ace-theme"),
        startLineNumber: 1,
        showGutter: codeEl.getAttribute("ace-gutter"),
        trim: true
    }, function (highlighted) {

    });
});
</script>

Answer 1

您需要将一个对象作为模式传递给高亮函数{path: "ace/mode/php", inline: true}。所以使用这样的东西：

<script>
var highlight = ace.require("ace/ext/static_highlight")
var dom = ace.require("ace/lib/dom")
function qsa(sel) {
    return Array.apply(null, document.querySelectorAll(sel));
}

qsa(".code").forEach(function (codeEl) {
    var mode = codeEl.getAttribute("ace-mode");
    if (mode == "php-inline")
        mode = {path: "ace/mode/php", inline: true}
    highlight(codeEl, {
        mode: mode,
        theme: codeEl.getAttribute("ace-theme"),
        startLineNumber: 1,
        showGutter: codeEl.getAttribute("ace-gutter"),
        trim: true
    }, function (highlighted) {

    });
});
</script>

不使用 PHP 标签的 ACE 静态突出显示

ACE static highlight without using PHP tags

static

editor

ace-editor