如何结合来自两个不同主题的 VS Code workbench 和令牌颜色
How to combine VS Code workbench and token colours from two different themes
我最近从 Sublime Text 3 转移到 VS Code,我想知道 - 在提出这个问题时 - 是否有一种方法可以使用我用于语法突出显示的 .tmTheme 文件崇高的文字。
我知道这将涉及创建自定义主题,因为 VS Code 并没有像 Sublime 和 Atom 那样从本质上将 UI 样式与语法突出显示分开,但是 VS Code 至少提供任何方法来自动化在使用 .tmTheme 文件中的编辑器颜色时组合一个主题的 UI(我认为在 VS Code 中称为 workbench)的过程?
在撰写本文时,唯一的方法真的是用 editor.tokenColorCustomizations
单独设置我的每个语法颜色吗?
将 VS Code 颜色主题的 UI 样式与现有 .tmTheme
文件中的语法突出显示相结合
不幸的是,截至撰写本文时,还没有简单的方法来完成此操作。单独使用 VS Code 的 Yeoman 主题生成器工具多次失败后,我终于设法按照 the instructions here 进行操作,然后进行一些额外的手动工作,尽管我发现第一种方法出于某种原因容易出现问题回到原点。然后我想出了第二种更持久的方法,到目前为止这还没有恢复。
方法一(容易倒退)
打开VS Code终端(Ctrl'),然后运行安装下面的命令,运行 Yeoman 主题生成工具:
npm install -g yo generator-code
cd %USERPROFILE%\Desktop
yo code
Select New color theme
、Start fresh
,然后按照提示输入您的主题名称和 ID(按 Enter 键将描述留空)。 Yeoman 将在您的桌面上为您的新主题创建一个主题文件夹。
假设您想要用作基础的 UI 样式的主题已经安装为 VS Code 扩展,导航到 %USERPROFILE%\.vscode\extensions
,单击基础主题的文件夹,然后找到它-color-theme.json
文件(通常在 themes
文件夹中)。将此文件复制到 newly-created 主题的 themes
文件夹,确保删除该文件夹中现有的 -color-theme.json
。
打开 newly-copied -color-theme.json
文件并查找以 "tokenColors":
开头的行。删除它后面的所有内容,包括方括号:
...并替换为包含语法高亮样式的 .tmTheme
文件的名称:
"tokenColors": "syntax-highlighting.tmTheme"
最后,将语法高亮文件复制到themes
文件夹,然后将整个主题文件夹复制到%USERPROFILE%\.vscode\extensions
。
重新启动 VS Code,并更改活动主题 (CtrlK,CtrlT) 到你的新主题。
方法二(持久化)
打开VS Code终端(Ctrl'),然后运行安装下面的命令,运行 Yeoman 主题生成工具:
npm install -g yo generator-code
cd %USERPROFILE%\Desktop
yo code
Select New color theme
, Import and inline an existing theme
,然后输入要使用其语法高亮样式的.tmTheme 文件的路径。注意这里必须是不带引号的绝对路径:
按照提示输入主题名称和 ID(按 Enter 将描述留空),然后 Yeoman 会在您的桌面上为新主题创建一个主题文件夹。
假设您想要用作基础的 UI 样式的主题已经安装为 VS Code 扩展,导航到 %USERPROFILE%\.vscode\extensions
,单击基础主题的文件夹,然后找到它文件(通常在 themes
文件夹内)。
复制此文件 colors
对象中的所有样式:
...并将它们粘贴到 Yeoman 创建的主题文件夹中 -color-theme.json
文件的 colors
对象中,确保删除所有存在的对象。
最后,将整个主题文件夹复制到%USERPROFILE%\.vscode\extensions
。
重新启动 VS Code,并更改活动主题 (CtrlK,CtrlT) 到你的新主题。如果你正确地遵循了这个过程,你现在应该有一个 VS 代码颜色主题,它使用你选择的基本主题的 UI 样式和你选择的 .tmTheme 文件的语法突出显示样式,并且不会在没有警告的情况下恢复.
我最近从 Sublime Text 3 转移到 VS Code,我想知道 - 在提出这个问题时 - 是否有一种方法可以使用我用于语法突出显示的 .tmTheme 文件崇高的文字。
我知道这将涉及创建自定义主题,因为 VS Code 并没有像 Sublime 和 Atom 那样从本质上将 UI 样式与语法突出显示分开,但是 VS Code 至少提供任何方法来自动化在使用 .tmTheme 文件中的编辑器颜色时组合一个主题的 UI(我认为在 VS Code 中称为 workbench)的过程?
在撰写本文时,唯一的方法真的是用 editor.tokenColorCustomizations
单独设置我的每个语法颜色吗?
将 VS Code 颜色主题的 UI 样式与现有 .tmTheme
文件中的语法突出显示相结合
不幸的是,截至撰写本文时,还没有简单的方法来完成此操作。单独使用 VS Code 的 Yeoman 主题生成器工具多次失败后,我终于设法按照 the instructions here 进行操作,然后进行一些额外的手动工作,尽管我发现第一种方法出于某种原因容易出现问题回到原点。然后我想出了第二种更持久的方法,到目前为止这还没有恢复。
方法一(容易倒退)
打开VS Code终端(Ctrl'),然后运行安装下面的命令,运行 Yeoman 主题生成工具:
npm install -g yo generator-code
cd %USERPROFILE%\Desktop
yo code
Select New color theme
、Start fresh
,然后按照提示输入您的主题名称和 ID(按 Enter 键将描述留空)。 Yeoman 将在您的桌面上为您的新主题创建一个主题文件夹。
假设您想要用作基础的 UI 样式的主题已经安装为 VS Code 扩展,导航到 %USERPROFILE%\.vscode\extensions
,单击基础主题的文件夹,然后找到它-color-theme.json
文件(通常在 themes
文件夹中)。将此文件复制到 newly-created 主题的 themes
文件夹,确保删除该文件夹中现有的 -color-theme.json
。
打开 newly-copied -color-theme.json
文件并查找以 "tokenColors":
开头的行。删除它后面的所有内容,包括方括号:
...并替换为包含语法高亮样式的 .tmTheme
文件的名称:
"tokenColors": "syntax-highlighting.tmTheme"
最后,将语法高亮文件复制到themes
文件夹,然后将整个主题文件夹复制到%USERPROFILE%\.vscode\extensions
。
重新启动 VS Code,并更改活动主题 (CtrlK,CtrlT) 到你的新主题。
方法二(持久化)
打开VS Code终端(Ctrl'),然后运行安装下面的命令,运行 Yeoman 主题生成工具:
npm install -g yo generator-code
cd %USERPROFILE%\Desktop
yo code
Select New color theme
, Import and inline an existing theme
,然后输入要使用其语法高亮样式的.tmTheme 文件的路径。注意这里必须是不带引号的绝对路径:
按照提示输入主题名称和 ID(按 Enter 将描述留空),然后 Yeoman 会在您的桌面上为新主题创建一个主题文件夹。
假设您想要用作基础的 UI 样式的主题已经安装为 VS Code 扩展,导航到 %USERPROFILE%\.vscode\extensions
,单击基础主题的文件夹,然后找到它文件(通常在 themes
文件夹内)。
复制此文件 colors
对象中的所有样式:
...并将它们粘贴到 Yeoman 创建的主题文件夹中 -color-theme.json
文件的 colors
对象中,确保删除所有存在的对象。
最后,将整个主题文件夹复制到%USERPROFILE%\.vscode\extensions
。
重新启动 VS Code,并更改活动主题 (CtrlK,CtrlT) 到你的新主题。如果你正确地遵循了这个过程,你现在应该有一个 VS 代码颜色主题,它使用你选择的基本主题的 UI 样式和你选择的 .tmTheme 文件的语法突出显示样式,并且不会在没有警告的情况下恢复.