在本文中，我们将首先简要介绍VS Code的基础知识，然后为您提供有关最有用的VS Code扩展的建议，涵盖了流行和独特，鲜为人知的扩展。
什么是Visual Studio代码？
Visual Studio Code是Microsoft提供的免费源代码编辑器，适用于Windows，Linux和macOS等不同的操作系统。
它具有对TypeScript，JavaScript和Node.js的内置支持。根据2019年堆栈溢出开发人员调查，它还包含许多有用的功能，使该开发工具在程序员中最受欢迎。
例如，使用VS Code扩展，开发人员可以更快地编写程序，而无需进行机械任务，因为其中一些扩展可以解决所有这些问题。例如，他们可以将更多时间花在思考使软件更具创新性而不是调试上的新方法上。
Visual Studio代码包含重要功能，例如：
更快地编写代码
调试功能可确保您的代码干净且无错误。
支持重构操作。
拆分视图，使您可以同时处理多个项目。
丰富的语义代码理解和导航
流行的VS代码扩展
GitLens
VS Code扩展可以帮助开发人员更好地理解他们的代码。当一行/块中发生更改时，他们可以搜索代码库的历史记录，并了解代码的更改方式和原因以及更改的原因。
Prettier - Code formatter
大多数开发人员，尤其是初学者，都在努力维护一致的代码。
Prettier通过从您的代码创建抽象语法树并使用其自己的规则重新打印，来强制实施一致的编码样式。
JavaScript (ES6) code snippets
编码往往是一项单调的任务，因为很多时候，开发人员需要一次又一次地编写相同的代码。使用代码片段，它们可以大大减少键入重复代码的需要，从而有更多时间专注于实际代码。
ESLint
这是一个整理工具，允许开发人员创建自己的整理规则，这样他们可以在代码中运行分析，以查看某些模式或代码是否不遵守特定的规则准则。对于需要格式化准则以保持代码一致的开发人员团队而言，此功能特别有用。
Bracket Pair Colorizer
括号是开发人员的噩梦。但是，通过此扩展，用户可以定义将哪个标记与什么颜色匹配。这样，方括号就可以轻松地用颜色标识，从而使开发人员拥有更加可读和一致的代码。
独特的VS代码扩展
Peacock
它们为Peacock VS Code扩展程序的创建者John Papa提供了灵感，该扩展程序允许开发人员更改其颜色设置。
为什么在编程中更改颜色设置很重要？
当您处理多个VS Code实例时，有时可能很难识别其中的每个实例。但是，当您使用颜色将它们彼此区分时，将变得更加容易。
因此，Peacock VS Code扩展可帮助开发人员识别工作区并以更好的方式组织工作区，从而最大程度地提高工作流程。
扩展亮点：
用不同的颜色自定义您的工作区。
与Live Share和VS Code Remote集成。
命令(在命令选项栏中找到)。
“收藏夹颜色”中的用户定义颜色。
调整受影响元素的颜色(使它们更深或更浅)。
WakaTime
WakaTime是程序员理想的工具，它可以跟踪他们花费了多少时间来编程，帮助他们评估性能，或者使他们知道他们是否在不必要的任务上花费了太多时间。通过此扩展，他们可以通过查看WakaTime对性能的见解来提高生产力。
WakaTime扩展亮点：
具有指标的个人仪表板。
评估您的代码(每个项目，文件，分支等的实时指标)。
支持600多种编程语言。
设置提醒。
使开发人员的日常编码保持一致。
carbon-now-sh
截取代码的屏幕截图并不是基本内容，但是仍然很有帮助。无论是因为您是喜欢在博客文章中添加漂亮的屏幕截图的技术作家，还是因为您是为团队创建演示文稿的远程程序员，使用屏幕截图都将某些事情带到了另一个层次。Carbon是完美的VS Code扩展。
尽管Carbon的主要功能是创建代码的屏幕截图，但它还有其他功能使此扩展：
自定义您的颜色主题，背景颜色或窗口样式。
生成SVG或PNG图像。
分享您的代码的屏幕快照。
自动检测编程语言并应用匹配的语法突出显示。
格式化生成的图像(带有字体大小和颜色主题)
vscode-base64
Base 64是一种编码算法，允许开发人员将任何字符转换为由拉丁字母，数字，加号和斜杠组成的字母。
它可以充当翻译器，用户可以将汉字、图像和表情符号转换为可读的字符串。
如今，大多数程序员都使用此独特的VS Code扩展名对二进制数据(例如图像)进行编码，以将其嵌入HTML或CSS文件中。此外，Base64用于对在传输或存储过程中可能遭受损坏的数据进行编码。
Base64的亮点：
发送电子邮件时附加文件。
将图像嵌入HTML或CSS。
输出二进制数据。
将二进制文件保存到数据库
Vim
Vim是一个文本编辑器，使开发人员可以高效地编写代码，这不仅因为其功能，而且还因为其原理。Vim反对使用鼠标，因此只能在动作和动作的概念下使用键盘。但是，尽管它是一个很棒的工具，但是大多数开发人员选择Visual Studio Code，因为它更具可定制性且具有更多功能。
Vim扩展亮点：
多级撤消树。
广泛的插件系统。
支持数百种编程语言。
易于定制。
它是高度可配置的。
Spotify
安装Spotify扩展程序时，您可以在编码时收听喜欢的歌曲，控制出现，暂停或跳过的歌曲。
Spotify扩展亮点：
可以在任何平台上使用。
在vscode状态栏中显示当前播放的歌曲。
提供命令热键。
歌词可用。
indent-rainbow
与Bracket Pair Colorizer相似，此独特的VS Code扩展的目的是通过区分不同颜色的凹痕来提高编码效率。
这个简单的扩展的主要目的是通过为每个缩进标签着色来使缩进更具可读性。默认情况下，它具有所有彩虹色，也可以轻松地将其自定义为最喜欢的颜色。
Visual Snake Code
在大多数情况下，程序员会花大量时间在工作上，甚至花费数小时才意识到这一点。这意味着他们几乎永不休息！
使用Visual Snake代码扩展，中断是不可协商的。此扩展功能可帮助程序员在经典的Snake游戏中分散注意力几分钟。
Visual Studio Code具有t成千上万个扩展，供开发人员使用和使用。尽管有一些流行的VS Code扩展非常有用，但不要忽略那些鲜为人知的扩展。这八个独特的VS Code扩展是寻求策略以提高工作效率并在工作中获得乐趣的开发人员的理想工具。

打开Visual Studio，在菜单栏找到【工具】，【选项】，【环境】→【字体和颜色】 



在右侧选择【纯文本】，【背景色】，【自定义】，

在颜色对话框中，右侧色调、饱和度、亮度栏，分别输入84、91、205



单击【添加到自定义颜色】→【确定】回到选项对话框中，点击【确定】，



好了，这时你应该会有惊喜，因为窗口已经变色啦



这种苹果绿，是保护视力最好的颜色哦

Visual Studio(简称vs)是一款功能十分强大的编译器,是我们众多程序员的非常喜爱一款编译器,也是初学者的不二选择. `作为程序猿,一个良好的代码界面可以帮助我们更好的阅读代码,以便及时修改错误,以达到事半功倍的效果,所以 vs提供了字体和颜色的修改,但是里面的显示项让我们很懵,到底哪个是我们要修改的显示项呢?下面我们来做简单的介绍.
我的原来的代码界面
背景是护眼色,适用于长时间敲代码的人


从哪里修改颜色呢?
1,


2.

3.接着设置自己喜欢的项前景,和项背景就可以了


*建议把背景颜色改为浅绿色，有助于减缓眼睛疲劳。

我的绿色护眼背景的颜色参数是：

在【纯文本】的【项背景】里设置如上参数即可
**下一篇文章我给大家介绍【字体与颜色】里的【显示项】（如下图）

对应界面中的哪些内容，请转到： ，https://blog.csdn.net/ysoftwarer/article/details/108322251

摘要：自定义Visual Studio Code（VSCode）的主题和代码颜色

在VS Code 的左下角，点击设置。



打开设置后，在搜索栏搜索关键字：主题。
搜索结果显示有许多个在setting.json中编辑，任意点开一个，即可编辑代码的颜色。



在文件setting.json的代码后面，插入相应的代码，然后保存。


代码如下：
    // 自定义的颜色
    "editor.tokenColorCustomizations": {
        "comments": "#55aa7f", // 注释
        "keywords": "#ff55ff", // 关键字
        "variables": "#a792e2", // 变量名 
        "strings": "#00ff7f", // 字符串
        "functions": "#ffff00", // 内置函数名
        "numbers": "#00eeff", // 数字
        "types": "#55bbff", //类定义颜色
    },

你会发现编辑器里的代码颜色随之改变了。


发现引号的颜色，还是不太喜欢，于是又找了许久资料，继续折腾。

//文本匹配规则后面的代码，会覆盖前面的颜色设置代码。

// 自定义的颜色
    "editor.tokenColorCustomizations": {
        "comments": "#55aa7f", // 注释
        "keywords": "#ff55ff", // 关键字
        "variables": "#5eccf8", // 变量名 函数的参数名 
        "strings": "#00ff7f", // 字符串
        "functions": "#ffbb00", // 自定义及内置的函数名称 如：print
        "numbers": "#00eeff", // 数字
        "types": "#55bbff", //类定义颜色
        //文本匹配规则
        "textMateRules": [
            //entity.name.function",                    //直接调用的函数
            //entity.name.type",                        //typedef定义的变量
            //keyword.control",                         //if switch break return
            //keyword.operator.assignment",             // =等号/赋值号 |= &=
            //"keyword.operator.logical",               //逻辑符号 && || !
            //"constant.character.escape",              //"\r\n"\
            //constant.other.placeholder",              //"%s %c"
            //punctuation.definition.comment",          // // /*注释开头
            //constant.numeric",                        //数字:50 10  0x20的20部分
            //keyword.operator.word                     //and or not
            //"scope":"meta",                           //括号 函数声明的括号 调用的括号...
            //punctuation.separator",                   //冒号 逗号
            //punctuation.terminator",                  //分号
            //storage.modifier",                        //static const
            //string.quoted.single",                    //单引号字符串
            //string.quoted.double",                    //双引号字符串
            //string.quoted.triple",                    //三引号字符串
            //"storage.type",                           //void int char 
            //"punctuation.definition.string.begin",    //左双引号
            //"punctuation.definition.string.end",      //右双引号
            //##########################################################################
            //系统内置的函数名称的颜色 如：print len 
            {
                "scope": "support.function",
                "settings": {
                    "foreground": "#ffbb00",
                }
            },
            //类的名称颜色 如class abc() 中的abc
            {
                "scope": "entity.name.type", //函数和类的名称颜色
                "settings": {
                    "foreground": "#14fff3",
                }
            },
            //类和函数的定义单词颜色 def class
            {
                "scope": "storage.type", //void int char 
                "settings": {
                    "foreground": "#ff00c8",
                }
            },
            //不知道是什么
            {
                "scope": "storage.modifier", //static const
                "settings": {
                    "foreground": "#ffe600de",
                }
            },
            //运算符号，如 +-*/=
            {
                "scope": "keyword.operator", //=等号/赋值号 |= &=
                "settings": {
                    "foreground": "#ff55ff",
                }
            },
            // 系统的控制关键词：如 if pass return f
            {
                "scope": "keyword.control", //if switch break return
                "settings": {
                    "foreground": "#ff00c8",
                    "fontStyle": ""
                }
            },
            //逻辑符号：如 and  or 
            {
                "scope": "keyword.operator.logical", //逻辑符号 && || !
                "settings": {
                    "foreground": "#ff00c8",
                    "fontStyle": ""
                }
            },
            //换行符、转义符等如 ：\r \n
            {
                "scope": "constant.character.escape", //"\r\n"
                "settings": {
                    "foreground": "#ee5050",
                    "fontStyle": ""
                }
            },
            //不知道是什么
            {
                "scope": "variable.other", //结构体对象和成员等
                "settings": { //VSCode使用C的颜色限制，这一点比较坑
                    "foreground": "#4f1eff", //比如Public.Delay(),颜色是一起变得
                    "fontStyle": "" //不能单独设置Public和Delay的显示颜色
                } //可能因为VS Code主要用于前端，对C的支持不够完善
            },
            //函数的参数名称
            {
                "scope": "variable.parameter", //函数参数-定义阶段
                "settings": {
                    "foreground": "#5eccf8",
                    "fontStyle": ""
                }
            },
            {
                "scope": "entity.name.section", //函数参数-调用阶段
                "settings": {
                    "foreground": "#ff0000",
                    "fontStyle": ""
                }
            },
            // 左单双引号
            {
                "scope": "punctuation.definition.string.begin",
                "settings": {
                    "foreground": "#00ff7f",
                    "fontStyle": "bold"
                }
            },
            //右单双引号
            {
                "scope": "punctuation.definition.string.end",
                "settings": {
                    "foreground": "#00ff7f",
                    "fontStyle": "bold" //加粗
                }
            },
            {
                "scope": [
                    "constant.other.symbol",
                ],
                "settings": {
                    "foreground": "#ff0000"
                }
            }
        ]
    },

现在变成了这样子：



成功修改了引号的颜色。但是True、None等系统保留字还是不知道怎么修改。

先这样吧，基本可用了！
对我而言，颜值第一，赏心悦目的重要性，永远靠前！