我的 VS Code 自定义
主题和图标
扩展
编辑设置（JSON）
结论
大家好！我是JD，这是我的第一篇帖子。VS Code是一款功能强大的编辑器，被全球数百万开发者使用。根据我的经验，我认识的大多数用户只是安装一个主题，除此之外就没做任何自定义了！所以我的第一篇帖子就来向大家展示我是如何自定义我的VS Code的。欢迎在评论区分享你的自定义设置！
有趣的事实：我们和一些同学有一句谚语：“Hay que afilar el machete”，翻译过来就是“磨利砍刀”或“磨利刀刃”，基本上是指磨利你的工作工具。
主题和图标
安装 VS Code 后，我们首先要做的事情之一就是寻找合适的主题。我自己是深色主题的用户，但我接下来要提到的主题也包含黑色、白色甚至红色等多种选择！这些主题包括：
- Dark+ Material（我目前安装的版本）。
- Material Theme
- 德古拉官方
至于图标，我同样喜欢其中两个，总是很难决定使用哪一个：
- Material Icon 主题
- vscode图标
扩展
我有两个必备的扩展程序：
- 括号对着色器
- 实时共享
括号对着色器通过为每对括号 ()、{} 和 [] 着色，帮助您跟踪当前所在的作用域，并突出显示当前作用域的主体部分。Live Share是一个强大的远程协作工具，方便您与团队成员协作。最新版本的 Live Share 现在包含聊天和音频共享功能。我还使用过另外两个实用的 React 项目扩展：Eslint和Prettier。这里有一份设置指南！
文章已失效
您可以直接从 VS Code Marketplace 安装以上所有组件。
编辑设置（JSON）
现在到了精彩的部分！我们要编辑保存 VS Code 所有设置的 JSON 文件。别担心，不会出什么问题（大概吧）。要打开这个 JSON 文件，请按F1 键，然后输入“Settings (JSON)”。注意：有些主题会修改这个 JSON 文件，所以如果你发现有一些你没写过的配置，不用担心。修改完成后记得保存文件，这样才能使更改生效。
FiraCode
FiraCode 是一款超棒的字体，带有连字功能！以下是我在 Windows 和 Ubuntu 系统上安装 FiraCode 的指南！
要在 VS Code 中启用 Firacode，请将以下代码添加到 Settings JSON 文件中：
{
"editor.fontFamily": "Fira Code",
"editor.fontLigatures": true
}
渲染小地图
VS Code 的小地图虽然实用，但难以阅读。既然如此，为什么还要费力去渲染字符呢？让我们通过在 JSON 文件中添加以下代码来禁用渲染选项，从而改善小地图的视觉效果：
{
"editor.minimap.renderCharacters": false
}
以下是未渲染状态下的小地图外观：
自定义光标外观和行为
您可以通过向 JSON 文件中添加一些代码来自定义光标。我的配置如下：
{
"editor.cursorBlinking": "expand",
"editor.cursorSmoothCaretAnimation": true,
"editor.cursorStyle":"line",
"editor.cursorWidth": 2
}
我建议您尝试不同的光标闪烁方式和光标样式，找到最适合您的设置。您可以自定义光标闪烁方式，例如闪烁、扩展、相位、平滑或实心；还可以自定义光标样式，例如块状、块状轮廓、线条、细线、下划线或细下划线。
更改评论颜色
有时我们需要尽快找到注释，还有什么比给它们赋予醒目的颜色更好的方法呢？将以下代码添加到 JSON 文件中，只需将十六进制颜色值更改为您选择的颜色即可：
{
"editor.tokenColorCustomizations": {
"comments": "#00ff00"
}
}
将方法和函数名称加粗
最后，我们来到了我最喜欢的自定义设置！这种自定义设置我之前都没意识到自己需要，但现在有了它，简直离不开它了！将方法和函数名加粗，不仅让它们看起来更酷炫，也更容易在代码中识别。以下是 JSON 代码：
{
"editor.tokenColorCustomizations": {
"textMateRules": [{
"scope": [
"entity.name.function",
"entity.name.method",
],
"settings": {
"fontStyle": "bold"
}
}]
}
}
尝试调整“实体”选项，它有很多不同的选项可以添加。
结论
这是我的JSON代码：
{
"editor.minimap.renderCharacters": false,
"editor.cursorBlinking": "expand",
"editor.cursorSmoothCaretAnimation": true,
"editor.cursorStyle":"line",
"editor.cursorWidth": 2,
"editor.fontFamily": "Fira Code",
"editor.fontLigatures": true,
"editor.tokenColorCustomizations": {
"comments": "#00ff00",
"textMateRules": [{
"scope": [
"entity.name.function",
"entity.name.method",
],
"settings": {
"fontStyle": "bold"
}
}]
}
}
就这些啦！如果你知道其他的定制方法，欢迎在评论区跟我分享！