在Visual Studio Code中实现自定义高亮显示

Question

我有一种自定义文件类型（扩展名为 .xyz）。我想在 Visual Studio Code 中为此文件实现自定义语法高亮（例如，以“＃”开头的所有行都是注释）。

是否有简单的说明来完成这个过程？我在文档中搜索了很久，但没有找到完整和直接的示例。

非常感谢。

- friol

Answer 1

我找到了一篇很好的文章，涉及你的问题：https://css-tricks.com/creating-a-vs-code-theme/ 你还可以查看这个视频： https://www.youtube.com/watch?v=Su-cNLe0dgw&ab_channel=RAZR 我建议你查阅这个构建扩展的指南（在这种情况下，是为了主题）: https://code.visualstudio.com/api/extension-capabilities/theming 事实上，我自己为一个名为electric的文件创建了语言支持扩展。 这是到github仓库页面的链接。 https://github.com/XtremeDevX/electric/tree/master/Language%20Support 这个视频教你如何自定义你的Visual Studio Code主题，实际上非常简单。 例如，这里是Dracula主题的示例：

"colors": {
        "terminal.background": "#282A36",
        "terminal.foreground": "#F8F8F2",
        "terminal.ansiBrightBlack": "#6272A4",
        "terminal.ansiBrightRed": "#FF6E6E",
        "terminal.ansiBrightGreen": "#69FF94",
        "terminal.ansiBrightYellow": "#FFFFA5",
        "terminal.ansiBrightBlue": "#D6ACFF",
        "terminal.ansiBrightMagenta": "#FF92DF",
        "terminal.ansiBrightCyan": "#A4FFFF",
        "terminal.ansiBrightWhite": "#FFFFFF",
        "terminal.ansiBlack": "#21222C",
        "terminal.ansiRed": "#FF5555",
        "terminal.ansiGreen": "#50FA7B",
        "terminal.ansiYellow": "#F1FA8C",
        "terminal.ansiBlue": "#BD93F9",
        "terminal.ansiMagenta": "#FF79C6",
        "terminal.ansiCyan": "#8BE9FD",
        "terminal.ansiWhite": "#F8F8F2",
        "contrastBorder": "#191A21",
        "focusBorder": "#6272A4",
        "foreground": "#F8F8F2",
        "selection.background": "#BD93F9",
        "errorForeground": "#FF5555",
        "button.background": "#44475A",
        "button.foreground": "#F8F8F2",
        "dropdown.background": "#343746",
        "dropdown.border": "#191A21",
        "dropdown.foreground": "#F8F8F2",
        "input.background": "#282A36",
        "input.foreground": "#F8F8F2",
        "input.border": "#191A21",
        "input.placeholderForeground": "#6272A4",
        "inputOption.activeBorder": "#BD93F9",
        "inputValidation.infoBorder": "#FF79C6",
        "inputValidation.warningBorder": "#FFB86C",
        "inputValidation.errorBorder": "#FF5555",
        "badge.foreground": "#F8F8F2",
        "badge.background": "#44475A",
        "progressBar.background": "#FF79C6",
        "list.activeSelectionBackground": "#44475A",
        "list.activeSelectionForeground": "#F8F8F2",
        "list.dropBackground": "#44475A",
        "list.focusBackground": "#44475A75",
        "list.highlightForeground": "#8BE9FD",
        "list.hoverBackground": "#44475A75",
        "list.inactiveSelectionBackground": "#44475A75",
        "list.warningForeground": "#FFB86C",
        "list.errorForeground": "#FF5555",
        "activityBar.background": "#343746",
        "activityBar.inactiveForeground": "#6272A4",
}

我缩短了内容因为文件里有很多行代码，但是如果你进入你的.vscode文件夹（在Windows中它在C:\Users\用户名\.vscode\），你应该会看到一个名为你的主题之类的文件夹。

一旦你进入了这个文件夹，你应该进入themes目录，然后你应该可以找到一个json文件，其中包含类似于我之前展示给你的数据！

谢谢！如果你觉得有帮助，请点个赞 :)

- XtremeDevX