javascript - 如何在 CodeMirror 3 中设置嵌套代码块的样式

Question

使用 CodeMirror 3.18，我希望能够将用户代码块的范围深度可视化为涉及关键字、原子等的常规样式的覆盖。

所以在下面的例子中，我已经评论了我想要的额外的 classNames 层：

if (happy) { // mark overlay depth 2 from here
    if (knowIt) { // mark overlay depth 3 from here
        clapYourHands(); // still 3 here
    } // back at depth 2
} // back at 1

我是否需要为此编写自己的词法分析器，或者是否可以扩展现有的（javascript）提示脚本？

最好我想让这些课程在每一行上加倍。我的目标（可能你感兴趣）是尝试看看我是否可以接近像 Scratch 这样的可视化：

Answer 1

您必须编写自己的模式，但将其编写为 JavaScript 模式的包装器可能是可行的 - 让其进行标记化和基本样式设置，您的包装器根据上下文添加额外的样式（它可以计数大括号，或者只是检查 JavaScript 模式状态下的上下文）。