王牌编辑器自定义模式 - 将突出显示规则添加到现有集合答案

【问题标题】：Ace Editor custom mode – adding highlight rules to existing set王牌编辑器自定义模式 - 将突出显示规则添加到现有集合
【发布时间】：2020-08-16 18:17:43
【问题描述】：

我有一个与 GraalVM 脚本相关的 JavaScript 编辑器（Ace Editor），我在其中添加了一些自定义 JavaScript 规则。我希望它们使用自定义突出显示规则反映在编辑器中。但是，无论我尝试什么，似乎都无法添加新规则。我有一个正确包含的自定义模式，问题出在规则中。

我的起点是这样的（不包括模式代码）：

ace.define('ace/mode/custom_highlight_rules', ['require', 'exports', 'ace/lib/oop', 'ace/mode/text_highlight_rules'], (acequire, exports) => {
    const oop = acequire('ace/lib/oop');
    const JavaScriptHighlightRules = acequire("./javascript_highlight_rules").JavaScriptHighlightRules;

    const CustomHighlightRules = function CustomHighlightRules() {
        this.$rules = new JavaScriptHighlightRules().getRules();
    };

    oop.inherits(CustomHighlightRules, JavaScriptHighlightRules);

    exports.CustomHighlightRules = CustomHighlightRules;
});

现在，我尝试使用文档中的addRules()，如下所示：

this.addRules({
    start: [ {
        token: "keyword",
        regex: "my_keyword",
    } ]
}, 'custom-');

但是，my_keyword 没有突出显示。

请务必注意，将其替换为：

this.$rules = {
    start: [ {
        token: "keyword",
        regex: "my_keyword",
    } ]
};

确实突出显示了这个关键字，但没有其他，因为没有其他规则——这就是我知道代码在做什么的方式。

我也试过这样的：

this.$rules.start.push({
    token: "keyword",
    regex: "my_keyword",
    next: "start",
});

所以规则在内置的start 对象中，但它似乎不起作用。还尝试了正则表达式的变体（例如，使用像 /my_keyword/ 这样的原生正则表达式代码）。

我注意到在使用addRules()时，我的自定义对象中没有processed: true，这表明可能是我添加规则太晚了？不过，这似乎是正确的地方。

我做错了什么？

【问题讨论】：

标签： ace-editor

【解决方案1】：

我没有详细说明为什么会这样，但看起来this.$rules 的分配需要在最后完成——所以首先需要构建对象，然后再分配。可以在此处找到有关如何执行此操作的工作示例：TypeScript 下的https://ace.c9.io/tool/mode_creator.html，它继承了 JavaScript，完全符合我的要求。

因此，我的函数现在看起来像这样：

const CustomHighlightRules = function CustomHighlightRules(options) {
    let customRules = [
        {
            token: "keyword",
            regex: "my_keyword"
        }
    ];

    let JSRules = new JavaScriptHighlightRules({jsx: (options && options.jsx)}).getRules();

    JSRules.no_regex = customRules.concat(JSRules.no_regex);
    this.$rules = JSRules;
}

【讨论】：