自定义按钮未显示在 VS 代码编辑器标题菜单栏中答案

【问题标题】：Custom button is not showing in the VS code editor title menu bar自定义按钮未显示在 VS 代码编辑器标题菜单栏中
【发布时间】：2020-05-03 02:24:51
【问题描述】：

在扩展中，我想添加一个按钮，以便在打开突触 XML 文档时在 VS 代码编辑器标题菜单栏中显示。为此，我在 package.json 文件的命令中添加了以下命令，

{
    "command": "webview.show",
    "title": "Show Diagram",
    "category": "Webview",
    "icon": {
        "light": "./resources/images/icons/design-view.svg",
        "dark": "./resources/images/icons/design-view-inverse.svg"
    }
}

在 package.json 文件中我添加了以下编辑器/标题，

"menus": {
    "editor/title": [
        {
            "when": "resourceLangId == SynapseXml",
            "command": "webview.show",
            "group": "navigation"
        }
    ],
}

但是当我运行扩展并打开一个突触 XML 文档时，它不会在编辑器标题菜单栏中显示按钮。

我还遵循了以下文档， https://code.visualstudio.com/api/references/contribution-points#contributes.menus

如何在 VS 代码编辑器标题菜单栏中显示按钮？

【问题讨论】：

你确定resourceLangId 是正确的吗？您是否尝试过不使用任何 when 条件作为健全性检查？
yes.resourceLangId 是正确的。我也尝试了不同的when 条件。但这对我来说效果不佳。
您确定您的扩展程序处于活动状态吗？你的activationEvents 是什么？也许尝试将"*" 放在那里？
扩展程序处于活动状态，我尝试将"*" 也放入activationEvents。但效果不佳。

标签： visual-studio-code vscode-extensions

【解决方案1】：

我将您的命令和菜单条目添加到我正在制作的扩展程序中，并且按钮出现在它应该出现的位置（在我的屏幕截图中没有图像，因为我没有图标）。在我的屏幕截图中，它是 ying-yang 按钮左侧的空白区域 - 工具提示在鼠标悬停时可见。我刚刚删除了“where”测试，所以我猜 resourceLangId 不是你认为的那样，或者图标路径可能是错误的，所以它看起来不像我的屏幕截图中那样存在

【讨论】：

在我的例子中，它需要when 条件仅在SynapseXml 文件已打开时显示按钮。

【解决方案2】：

对于仍有相同问题的任何人：

在我的例子中，使用正确的上下文名称字段 (editorLangId) 来匹配命令的 when 子句中的语言 ID 解决了这个问题。

https://code.visualstudio.com/api/references/when-clause-contexts#available-contexts

"menus": {
    "editor/title": [
        {
            "when": "editorLangId == SynapseXml",
            "command": "webview.show",
            "group": "navigation"
        }
    ]
}

【讨论】：