VSCode 将图标添加到 Activity Bar

Question

如何向 中添加其他扩展图标Activity Bar？
我想在源代码管理和调试图标旁边添加新的自定义图标。
我读了这一页但不明白。
我转到路径C:\Users\Moh\AppData\Local\Programs\Microsoft VS Code\resources\app并将此配置添加到 package.json：

// etc...
"author": {
  "name": "Microsoft Corporation"
},
"license": "MIT",
"main": "./out/main",

//***************//
// I added following lines:
"contributes": {
  "views": {
    "code-runner": [
      {
        "id": "codeRunner",
        "name": "Code Runner"
      }
    ]
  }
},

// etc...

但一切都没有改变。
我选择的道路正确吗？
写的配置是否正确？

Answer 1

此代码将添加到package.json您正在构建的扩展中。如果您不知道这意味着什么，请阅读有关进行第一个扩展的文档。

从文档来看，它的工作原理是：

"contributes": {

    "viewsContainers": {

      "activitybar": [

        {
          "id": "package-explorer",        (use this id for the view name below)
          "title": "Package Explorer",
          "icon": "$(heart)"               (using built-in icons, it is this easy)
        }
      ]
    },

    "views": {

      "package-explorer": [                (id from above)

        {
          "id": "package-dependencies",    (viewlets within "PAckage Explorer")
          "name": "Dependencies",
          "type": "tree"
        },
        {
          "id": "package-outline",
          "name": "Outline"
        }
      ]
    }

活动栏是一种ViewContainer. 当您单击心形图标时，它会在侧栏中打开一个视图，其中有两个“视图”：Dependencies和Outline。

此处讨论内置图标： https: //code.visualstudio.com/api/references/icons-in-labels，但您可以使用自己的图标，详细信息如下：https://code.visualstudio.com/api/参考资料/贡献点#图标规格

当您调试扩展时，您将在打开的新 vscode 窗口中看到 ViewContainer 和 View 贡献来运行您的扩展。