CodeMirror简单模式-正则表达式未按预期突出显示 [英] CodeMirror simple mode - regex not highlighting as expected

问题描述

我正在尝试使用

使用此正则表达式显然不正确：

  / \b（？：timer | counter | version）\b / gi 
  

但是我已经尝试了几种不同的方法，并且相同的模式在其他正则表达式测试器中也可以正常工作。示例：
https://regex101.com/r/lQ0lL8/33 。有任何建议吗？

编辑＃1：

尝试在代码镜像定义中使用此模式，删除/ g，但仍会产生相同的错误突出显示。 / p>

  {regex：/ \b（？：timer | counter | version）\b / i，令牌：关键字} 
  

解决方案

我最终只是从零开始定义自己的模式，定制似乎奏效了。我按单词解析流，将其转换为小写，然后检查它是否在我的关键字列表中。使用这种方法似乎很容易添加其他样式和关键字。

  var关键字= [ timer， counter， 版]; 
 
 CodeMirror.defineMode（ mymode，function（）{
 
 return {
令牌：function（stream，state）{
 stream.eatWhile （/ \w /）; 
 
 if（arrayContains（stream.current（），关键字））{
返回 style1; 
} 
流。 next（）; 
} 
}; 
 
}）; 
 
 
 var编辑器= CodeMirror.fromTextArea（document.getElementById（'cm'），{
 mode： mymode，
 lineNumbers：true 
 }）; 
 
函数arrayContains（needle，arrhaystack）{
 var lower = needle.toLowerCase（）; 
 return（arrhaystack.indexOf（lower）> -1）; 
} 
  

工作小提琴

I'm trying to use CodeMirror simple mode to create my own editor and highlight some custom keywords. However, it's highlighting occurrences of these words inside other words. Here's my code to define the mode of the editor:

    CodeMirror.defineSimpleMode("simple", {
  // The start state contains the rules that are intially used
  start: [
    // The regex matches the token, the token property contains the type
    {regex: /["'](?:[^\\]|\\.)*?(?:["']|$)/, token: "string"},
    {regex: /;.*/, token: "comment"},
    {regex: /\/\*/, token: "comment", next: "comment"},

    {regex: /[-+\/*=<>!]+/, token: "operator"},
    {regex: /[\{\[\(]/, indent: true},
    {regex: /[\}\]\)]/, dedent: true},

    //Trying to define keywords here
    {regex: /\b(?:timer|counter|version)\b/gi, token: "keyword"} // gi for case insensitive
  ],
  // The multi-line comment state.
  comment: [
    {regex: /.*?\*\//, token: "comment", next: "start"},
    {regex: /.*/, token: "comment"}
  ],
  meta: {
    dontIndentStates: ["comment"],
    lineComment: ";"
  }
});

When I type in the editor, this is what gets highlighted. I would expect the first two occurrences to be styled, but not the second two.

It's obviously something incorrect with this regular expression:

/\b(?:timer|counter|version)\b/gi

But I've tried it several different ways and the same pattern works correctly in other regex testers. Example: https://regex101.com/r/lQ0lL8/33 . Any advice?

Edit #1:

Tried this pattern in codemirror definition, dropping the /g but it still yields the same incorrect highlighting.

{regex: /\b(?:timer|counter|version)\b/i, token: "keyword"}

解决方案

I ended up just defining my own mode from scratch and the additional customization seems to have worked. I parse the stream by word, convert to lowercase, then check if it's in my list of keywords. Using this approach it seems very straightforward to add additional styles and keywords.

var keywords = ["timer", "counter", "version"];

CodeMirror.defineMode("mymode", function() {

  return {
    token: function(stream, state) {
      stream.eatWhile(/\w/);

      if (arrayContains(stream.current(), keywords)) {
        return "style1";
      }
      stream.next();
    }
  };

});


var editor = CodeMirror.fromTextArea(document.getElementById('cm'), {
  mode: "mymode",
  lineNumbers: true
});

function arrayContains(needle, arrhaystack) {
  var lower = needle.toLowerCase();
  return (arrhaystack.indexOf(lower) > -1);
}

Working Fiddle

这篇关于CodeMirror简单模式-正则表达式未按预期突出显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！