VS Code 颜色主题调试技巧

Question

VS Code 颜色主题调试技巧

visual-studio-codevscode-extensionsvs-color-theme-editor

3

VS Code编辑器没有显示正确的主题。有时它可以工作，有时候不行，我无法弄清楚如何复制它。我卸载了VS Code并重新安装了它，但仍然无法调试我的自定义主题。

我已经创建了一个新的颜色主题

$ yo code

我选择了 新的颜色主题，并选择了 黑色空白主题。

现在当我启动调试器时，它会加载一个具有我的主题的新编辑器。我可以在 首选项 和 颜色主题 菜单中进行选择。

然后有时它无法应用所选更改。

但是当我从 tokenColors: [...] 中删除所有内容后，它会让我重新选择颜色主题，但是当我在 tokenColors 中键入一些新主题并重新加载时，它不会应用新样式。

我猜想 VS Code 在某个地方缓存了样式，并且不会覆盖它。

问题是如果我无法调试它，我怎么开发新的颜色主题呢？

如何重新加载主题？

{
  "name": "T",
  "type": "dark",
  "colors": {
    "editorGroup.background": "#2b303b",
    "editorGroup.border": "#c0c5ce",
    "editor.background": "#2b303b",
    "editor.foreground": "#c0c5ce",
    "activityBarBadge.background": "#2b303b",
    "sideBar.background": "#1c1f26",
    "sideBar.foreground": "#c0c5ce",
    "list.hoverBackground": "#2b303b",
    "list.hoverForeground": "#c0c5ce",
    "list.activeSelectionForeground": "#c0c5ce",
    "list.inactiveSelectionForeground": "#c0c5ce",
    "list.activeSelectionBackground": "#2b303b",
    "list.inactiveSelectionBackground": "#2b303b",
    "sideBarTitle.foreground": "#c0c5ce",
    "sideBarSectionHeader.background": "#2b303b",
    "statusBar.background": "#1c1f26",
    "statusBar.foreground": "#c0c5ce",
    "tab.activeBackground": "#2b303b",
    "tab.inactiveBackground": "#1c1f26",
    "terminal.background": "#2b303b",
    "activityBar.border": "#1c1f26",
    "activityBar.background": "#2b303b",
    "sideBar.border": "#1c1f26",
    "tab.activeForeground": "#c0c5ce"
  },
  "tokenColors": [
    {
      // const, let, if, else, async, await, try, catch
      "name": "j",
      "scope": [
        "storage.type.js.jsx",
        "storage.modifier.async.js.jsx",
        "keyword.control.flow.js.jsx",
        "keyword.control.conditional.js.jsx",
        "keyword.control.trycatch.js.jsx"
      ],
      "settings": {
        "foreground": "#b48ead",
        "fontStyle": "italic"
      }
    }
  ]
}

- LukasA

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jeff Hykin · Accepted Answer

你可以使用VS Code调试器。

在VS Code中打开项目文件夹。
如果不存在，请创建.vscode/文件夹。
在该文件夹内创建launch.json文件，并将以下内容复制到文件中。

其中，"Original Answer"翻译成"最初的回答"。

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "extensionHost",
            "request": "launch",
            "name": "Launch Extension",
            "runtimeExecutable": "${execPath}",
            "args": [
                "--extensionDevelopmentPath=${workspaceFolder}"
            ],
            "outFiles": [
                "${workspaceFolder}/out/**/*.js"
            ],
        },
    ]
}

启动调试器（CMD/CTRL + D）
确保在新打开的窗口中选择您的主题
每次更改主题后都要重新加载调试器

单独问题

虽然以上是通常的调试方式，但特别针对这个问题可能是由于添加到tokenColors中的新作用域被更高优先级的作用域覆盖而未显示出来。如果不了解更多情况，很难确定。我认为VS Code没有将更改缓存到任何地方，完全重新加载窗口应该总是从头开始。