Monaco 使用 SymbolProvider

Monaco 中提供一个搜索符号的功能，可以快速跳转到指定符号的位置，可以通过实现 SymbolProvider 实现自定义的 Symbol，如下图，function1 是自定义的符号，当进入符号列表时可以看到 “a1"。

通过 registerDocumentSymbolProvider 注册自定义 Symbol 方法。

实现 provideDocumentSymbols 并返回 Symbols 列表

DocumentSymbol 包含的主要属性

实现代码如下

export function documentSymbolProvider(editor: monacoEditor.editor.IStandaloneCodeEditor, monaco: typeof monacoEditor){
  return monaco.languages.registerDocumentSymbolProvider('javascript', {
    provideDocumentSymbols: function(model, token) {
        const symbols: monacoEditor.languages.DocumentSymbol[] = [];
        const lines = model.getLinesContent();

        lines.forEach((line, lineNumber) => {
            const match = /function1\s+(\w+)/.exec(line);
            if (match) {
                const symbol: monacoEditor.languages.DocumentSymbol = {
                  name: match[1],
                  detail: '',
                  tags: [],
                  kind: monaco.languages.SymbolKind.Function,
                  range: {
                      startLineNumber: lineNumber + 1,
                      startColumn: line.indexOf('function1') + 1,
                      endLineNumber: lineNumber + 1,
                      endColumn: line.length + 1,
                  },
                  selectionRange: {
                      startLineNumber: lineNumber + 1,
                      startColumn: line.indexOf('function1') + 1,
                      endLineNumber: lineNumber + 1,
                      endColumn: line.length + 1,
                  },
                  children: []
              }
                symbols.push(symbol);
            }
        });

        return symbols;
    }
});
}