VSCode 如何设置编辑器的右键菜单选项 VSCode 编辑器右键菜单选项的设置技巧-VSCode-PHP中文网

VSCode 如何设置编辑器的右键菜单选项 VSCode 编辑器右键菜单选项的设置技巧

星夢妙者

发布： 2025-08-15 10:17:01

原创

900人浏览过

定制vscode右键菜单需编辑settings.json文件，通过配置"editor.contextmenu"数组实现；2. 每个菜单项包含command（命令id）、group（分组与排序）和when（显示条件）属性；3. 命令id可通过命令面板搜索获取，如"format document"对应"editor.action.formatdocument"；4. 使用when子句可控制菜单项显示条件，如"editorlangid == javascript"限定仅javascript文件显示；5. 自定义菜单项需开发vscode扩展，使用package.json注册命令并绑定到"editor/context"菜单；6. group属性格式为"组名@排序"，预设组如navigation、1_modification、9_cutcopypaste、z_commands等，数字越小排序越靠前；7. 若配置不生效，应检查json语法、命令id正确性、when条件是否满足，并尝试重新加载或重启vscode。所有配置均需保存后生效，且正确无误才能正常显示菜单项。

VSCode 如何设置编辑器的右键菜单选项 VSCode 编辑器右键菜单选项的设置技巧

VSCode 编辑器的右键菜单定制，其实就是修改

settings.json

登录后复制

文件，通过配置

editor.contextmenu

登录后复制

来实现。让常用的功能触手可及，提高开发效率。

解决方案

要定制 VSCode 的右键菜单，需要编辑

settings.json

登录后复制

文件。可以通过以下步骤操作：

打开 VSCode，按下
```
Ctrl+Shift+P
```
登录后复制
(Windows/Linux) 或
```
Cmd+Shift+P
```
登录后复制
(macOS) 打开命令面板。
输入 "Preferences: Open Settings (JSON)" 并选择该选项，打开
```
settings.json
```
登录后复制
文件。
在
```
settings.json
```
登录后复制
文件中，添加或修改
```
editor.contextmenu
```
登录后复制
属性。该属性是一个数组，每个元素定义一个菜单项。

editor.contextmenu

登录后复制

的基本结构如下：

"editor.contextmenu": [
    {
        "command": "命令ID",
        "group": "组名@排序",
        "when": "条件"
    }
]

登录后复制

```
command
```
登录后复制
: 要执行的命令 ID。可以通过命令面板 (
```
Ctrl+Shift+P
```
登录后复制
或
```
Cmd+Shift+P
```
登录后复制
) 查找命令 ID。
```
group
```
登录后复制
: 指定菜单项所属的组，以及在组内的排序。格式为
```
组名@排序
```
登录后复制
。常见的组名包括
```
navigation
```
登录后复制
、
```
1_modification
```
登录后复制
、
```
9_cutcopypaste
```
登录后复制
、
```
z_commands
```
登录后复制
等。排序使用数字，数字越小，排序越靠前。
```
when
```
登录后复制
: 可选属性，指定菜单项的显示条件。例如，
```
editorFocus
```
登录后复制
表示只有在编辑器获得焦点时才显示。

举个例子，如果想把 "Format Document" 命令添加到右键菜单，可以这样配置：

"editor.contextmenu": [
    {
        "command": "editor.action.formatDocument",
        "group": "1_modification@1"
    }
]

登录后复制

这个配置会将 "Format Document" 命令添加到

1_modification

登录后复制

组的最前面。

如何查找 VSCode 命令 ID？

查找 VSCode 命令 ID 最简单的方法是使用命令面板。

按下
```
Ctrl+Shift+P
```
登录后复制
(Windows/Linux) 或
```
Cmd+Shift+P
```
登录后复制
(macOS) 打开命令面板。
输入你想添加的命令的名称，例如 "Format Document"。
在搜索结果中，可以看到命令的名称和 ID。命令 ID 通常以
```
editor.action.
```
登录后复制
开头。

例如，"Format Document" 命令的 ID 是

editor.action.formatDocument

登录后复制

。

如何自定义右键菜单的显示条件？

when

登录后复制

属性可以用来控制右键菜单项的显示条件。VSCode 提供了很多内置的

when

登录后复制

子句，可以根据不同的情况显示不同的菜单项。

一些常用的

when

登录后复制

子句包括：

```
editorFocus
```
登录后复制
: 编辑器获得焦点时显示。
```
editorHasSelection
```
登录后复制
: 编辑器中有选中文本时显示。
```
editorLangId == javascript
```
登录后复制
: 编辑器打开的是 JavaScript 文件时显示。
```
resourceExtname == .json
```
登录后复制
: 打开的是 JSON 文件时显示。
```
resourceScheme == file
```
登录后复制
: 打开的是本地文件时显示。

例如，如果想只在 JavaScript 文件中显示 "Format Document" 命令，可以这样配置：

"editor.contextmenu": [
    {
        "command": "editor.action.formatDocument",
        "group": "1_modification@1",
        "when": "editorLangId == javascript"
    }
]

登录后复制

这样，只有在打开 JavaScript 文件时，右键菜单才会显示 "Format Document" 命令。

如何添加自定义的右键菜单项？

AI图像编辑器

使用文本提示编辑、变换和增强照片

查看详情

除了使用 VSCode 内置的命令，还可以添加自定义的右键菜单项。这需要使用 VSCode 的扩展 API。

首先，需要创建一个 VSCode 扩展。然后在扩展的代码中，使用

vscode.commands.registerCommand

登录后复制

注册一个命令，并使用

vscode.commands.executeCommand

登录后复制

执行该命令。

然后在

package.json

登录后复制

文件中，配置

contributes.menus.editor/context

登录后复制

属性，将自定义命令添加到右键菜单。

例如，以下是一个简单的示例：

// package.json
{
    "contributes": {
        "menus": {
            "editor/context": [
                {
                    "command": "myExtension.helloWorld",
                    "group": "z_commands",
                    "when": "editorFocus"
                }
            ]
        },
        "commands": [
            {
                "command": "myExtension.helloWorld",
                "title": "Hello World"
            }
        ]
    }
}

// extension.js
const vscode = require('vscode');

function activate(context) {
    let disposable = vscode.commands.registerCommand('myExtension.helloWorld', function () {
        vscode.window.showInformationMessage('Hello World from My Extension!');
    });

    context.subscriptions.push(disposable);
}

exports.activate = activate;

登录后复制

这个示例会在右键菜单的 "z_commands" 组中添加一个名为 "Hello World" 的菜单项。点击该菜单项会显示一个 "Hello World from My Extension!" 的消息框。

如何对右键菜单进行分组和排序？

group

登录后复制

属性用于对右键菜单进行分组和排序。

group

登录后复制

属性的格式为

组名@排序

登录后复制

。

VSCode 预定义了一些常用的组名，例如：

```
navigation
```
登录后复制
: 导航相关的命令。
```
1_modification
```
登录后复制
: 修改相关的命令。
```
9_cutcopypaste
```
登录后复制
: 剪切、复制、粘贴相关的命令。
```
z_commands
```
登录后复制
: 自定义命令。

排序使用数字，数字越小，排序越靠前。例如，

1_modification@1

登录后复制

表示

1_modification

登录后复制

组的最前面。

如果想创建一个新的组，可以使用自定义的组名。例如，

myGroup@1

登录后复制

。

需要注意的是，VSCode 会按照组名和排序对右键菜单进行排序。因此，选择合适的组名和排序可以使右键菜单更加清晰和易于使用。

如何解决右键菜单配置不生效的问题？

如果修改了

settings.json

登录后复制

文件，但右键菜单没有更新，可以尝试以下方法：

重新加载 VSCode：按下
```
Ctrl+Shift+P
```
登录后复制
(Windows/Linux) 或
```
Cmd+Shift+P
```
登录后复制
(macOS) 打开命令面板，输入 "Reload Window" 并选择该选项。
检查
```
settings.json
```
登录后复制
文件是否有语法错误：VSCode 会在编辑器中显示语法错误。
检查
```
command
```
登录后复制
是否正确：确保命令 ID 是正确的。
检查
```
when
```
登录后复制
子句是否正确：确保
```
when
```
登录后复制
子句的条件是满足的。
重启 VSCode：有时候重启 VSCode 可以解决一些奇怪的问题。