如何在 Visual Studio 代码中添加主题？

Question

我最近下载了VS code editor，真的很不错。但我发现它唯一的问题是颜色主题，我习惯了 monokai 颜色主题就像在 sublime text 中一样，我找不到编辑的方法颜色主题或下载颜色主题只有2个选项：

深色主题
浅色主题

如何添加我自己的主题或复制现有主题以便我能够根据需要编辑配色方案？

我设法更改了以下文件中的一些颜色，但仍然我不知道如何添加全新的主题:

resources/app/client/vs/monaco/ui/workbench/native/native.main.css

看起来颜色主题很快就会可用，它将成为插件系统的一部分

visual-studio-code/suggestions/7756227-theme

Answer 1

我发现文件 - resources/app/client/vs/monaco/ui/workbench/native/native.main.css - 也是更改字体渲染方式的正确位置。我试图弄清楚如何在 OS X 上禁用字体平滑，发现你可以通过在文件中添加这个 CSS 规则来做到这一点 -

.monaco-editor {
  -webkit-font-smoothing: none;  
}

Answer 2

目前不支持添加全新的主题。您可以在这里提交您的功能请求，我已经听到有人提出这个要求 https://visualstudio.uservoice.com/forums/293070-visual-studio-code

Answer 3

Visual Studio 代码 0.9.0 及更高版本

有关于如何添加自定义主题的official documentation。

您需要一个 .tmtheme 文件作为您要添加的主题。您可以找到现有文件，例如GitHub、ColorSublime or you can define your own theme file (for example with tmTheme-Editor).

找到 .tmtheme 文件后，您有两种方法可以基于它创建扩展。

使用 Yeoman 生成器：
- 安装 node.js（如果您尚未安装）
- 通过执行 npm install -g yo
- 为代码安装 Yo 生成器：npm install -g generator-code
- 运行 yo code 和 select New Color Theme
- 按照说明进行操作（定义 .tmTheme 文件、主题名称、ui 主题等）
- 生成器在您当前的工作目录中使用主题名称为您的扩展创建一个目录。

自行创建目录：

使用您的插件名称创建一个目录（仅限小写字母）。假设我们称它为 mytheme.
添加子文件夹 themes 并将 .tmTheme 文件放入其中
在扩展文件夹的根目录中创建一个文件 package.json，内容如下

{        
    "name": "theme-mytheme",
    "version": "0.0.1",
    "engines": {
        "vscode": ">=0.9.0-pre.1"
    },
    "publisher": "me",
    "contributes": {
        "themes": [
            {
                "label": "My Theme",
                "uiTheme": "vs-dark", // use "vs" to select the light UI theme
                "path": "./themes/mytheme.tmTheme"
            }
        ]
    }
}

最后将您的扩展添加到 Visual Studio 代码

将扩展文件夹复制到扩展目录。这是：

上 Windows %USERPROFILE%\.vscode\extensions
上 Mac/Linux $HOME/.vscode/extensions

重新启动 VSCode 和 select File -> Preferences -> Color Theme

中的新主题

Visual Studio代码0.8.0

可以在 Visual Studio 代码 0.8.0 中添加新主题（于 2015-08-31 become an insider 向内部人员发布）。

安装 VSCode 0.8.0 或更高版本后执行此操作以应用您自己的主题：

下载 .tmTheme 文件或创建您自己的文件（例如 tmTheme-Editor）
将.tmTheme文件复制到%CODEFOLDER%/resources/app/plugins/vs.theme.starterkit/themes

通过添加条目在 %CODEFOLDER%/resources/app/plugins/vs.theme.starterkit/ticino.plugin.json 中注册 .tmTheme 文件，如下所示：

{
    "id": "vs-theme-mynewtheme", // internal ID
    "label": "MyNewTheme",       // displayed name for the theme
    "uiTheme": "vs-dark",        // general UI appeareance (
                                 // "vs" for light themes, 
                                 // "vs-dark" for dark themes)
    "path": "./themes/myNewTheme.tmTheme" // file path 
},

重新启动 VSCode 和 select File -> Preferences -> Color Theme
中的新主题

如何在 Visual Studio 代码中添加主题？

How to add theme in Visual Studio Code?

color-scheme

visual-studio-code