如何让Monaco编辑器的Go to/Peek动作在命令面板及getActions中可用？

问题原因 #

Monaco的Go to/Peek这类定义跳转动作是上下文依赖型动作：只有当编辑器配置了对应语言的语言服务（Worker）、且光标定位在可跳转的符号（变量、函数、类等）上时，才会被动态注册到编辑器动作列表或全局命令中。右键菜单能看到是因为菜单会实时检查当前上下文，不会提前过滤不可用的选项。

解决步骤 #

1. 确保正确配置语言服务与Worker #

这是基础前提，没有语言服务支持，跳转动作根本无法工作：

• 以JavaScript/TypeScript为例，需要先配置Worker加载路径：

  self.MonacoEnvironment = {
    getWorkerUrl: function (moduleId, label) {
      if (label === 'javascript' || label === 'typescript') {
        return './node_modules/monaco-editor/esm/vs/language/typescript/ts.worker.js';
      }
      // 其他语言的Worker路径同理配置
      return './node_modules/monaco-editor/esm/vs/editor/editor.worker.js';
    }
  };
  

• 初始化编辑器时指定对应语言：

  const editor = monaco.editor.create(document.getElementById('container'), {
    value: 'function test() {} test();',
    language: 'javascript'
  });
  

2. 手动注册全局命令到命令面板 #

如果需要强制让命令在面板中可见（即使当前上下文不可用），可以手动注册全局命令：

// 注册Peek Definition命令
monaco.commands.registerCommand('editor.action.peekDefinition', () => {
  const activeEditor = monaco.editor.getActiveEditor();
  if (activeEditor) {
    // 触发编辑器内部的跳转动作
    activeEditor.trigger('manual-trigger', 'editor.action.peekDefinition', {});
  }
});

注册后，就能在命令面板中搜到editor.action.peekDefinition，执行时会自动触发当前激活编辑器的对应动作（如果上下文允许）。

3. 让editor.getActions()能获取到动作 #

editor.getActions()只会返回当前上下文已激活的动作，所以需要满足两个条件：

• 编辑器已配置对应语言的Worker
• 光标定位在可跳转的符号上
  此时再执行查询代码，就能获取到对应的动作：

// 光标定位到test函数后执行
const peekAction = editor.getActions().filter(x => x.id === 'editor.action.peekDefinition')[0];
if (peekAction) {
  peekAction.run(); // 直接执行动作
}

内容的提问来源于stack exchange，提问作者Nikita Markevich