Monaco 使用 DocumentHighlightProvider

Monaco 中有一个文字高亮的功能，就是选中一个单词，会高亮文字文档中所有出现该单词的位置，效果如下：

Monaco 默认就有这个功能，可以根据具体需求进行定制。通过 registerDocumentHighlightProvider 进行注册

实现 provideDocumentHighlights 方法，返回 DocumentHighlight 数组

代码实现如下， 代码有个 DocumentHighlightKind 枚举类，包括 Text、Read 和 Write，从效果上来看没有啥区别。

export function documentHighlightProvider(editor: monacoEditor.editor.IStandaloneCodeEditor, monaco: typeof monacoEditor){
  return monaco.languages.registerDocumentHighlightProvider("javascript",{
    provideDocumentHighlights: (model, position, token) => {
      const word = model.getWordAtPosition(position);
      if (!word) {
        return [];
      }
      const wordRange = new monaco.Range(
        position.lineNumber,
        word.startColumn,
        position.lineNumber,
        word.endColumn
      );
      const matches: monacoEditor.languages.DocumentHighlight[] = [];
  
      // Search the entire document for the word
      const regex = new RegExp(`\\b${word.word}\\b`, 'g');
      for (let i = 1; i <= model.getLineCount(); i++) {
        const lineText = model.getLineContent(i);
        let match: RegExpExecArray | null;
        while ((match = regex.exec(lineText)) !== null) {
          matches.push({
            range: new monaco.Range(
              i,
              match.index + 1,
              i,
              match.index + 1 + word.word.length
            ),
            kind: monaco.languages.DocumentHighlightKind.Read
          });
        }
      }
  
      return matches;
    }
  })
}