根据2023 年 Stack Overflow 开发者调查，Visual Studio Code（也称为 VSCode）被评为最受欢迎的集成开发者环境 (IDE) 工具。
Visual Studio Code 具有许多开箱即用的出色功能，并支持大型扩展社区以添加增强的功能。
Stack Overflow 调查图片显示 VSCode 的受欢迎程度（73.71% 的受访者使用它）
使用扩展可以扩展 VSCode 的可用功能和工具。由于大多数工具集中在一处，因此可以减少上下文切换，而上下文切换已被证明会降低生产力。
去年，我测试了 40 多个不同的扩展，并完善了我最喜欢的扩展列表。这些扩展提高了我作为软件工程师的工作效率。我也想与您分享这份清单，以提高您的工作效率。
该列表的设计与语言无关，强调生产力。如果您有兴趣探索我推荐的扩展来自定义编辑器的样式，您可以在本文中找到更多详细信息。
我们将介绍的 VSCode 扩展：
-
[Better Comments]
-
[Bookmarks]
-
[Code Spell Checker]
-
[CodeSnap]
-
[CodiumAI]
-
[Error Lens]
-
[Git History]
-
[GitLens]
-
[GitHub Copilot]
-
[Icons Themes]
-
[Indent Rainbow]
-
[Live Share]
-
[Multiple Cursor Case Preserve]
-
[Path Intellisense]
-
[Peacock]
-
[Prettier]
-
[Project Manager]
-
[Tabnine]
-
[TODO Highlight]
-
[Todo Tree]
在本文中，我将更详细地介绍所有这些扩展，并就它们如何提高开发人员的效率水平提供建议。
更好的评论
Better Comments可以帮助您加强代码中的注释。代码注释有利于可读性，并提供解释或上下文以供将来参考。留下良好的代码注释可以在将来节省他人和您自己的时间。
支持的功能包括对警报注释进行分类、编写查询、制作 TODO 列表以及显示突出显示的功能。有一个广泛的受支持语言列表。
被注释掉的代码行的样式为深灰色，并带有文本删除线，强调它们被排除并表明它们应该被删除。
使用更好的注释样式化代码注释。
书签
书签允许您为代码中的位置添加书签。这些行用蓝色书签图标标注。可以组织和命名书签以便快速参考。
所有书签都可以在专用的侧边栏部分中找到。这是一个改进导航的好工具，可以帮助您节省搜索参考的时间。
书签以蓝色显示，行号旁边有一个书签图标。
代码拼写检查器
代码拼写检查器名副其实。它提供了一个基本的拼写检查器来查找并修复整个代码库中的拼写错误。拼写错误的单词用波浪形下划线表示。它有多种语言版本。
这是我个人最喜欢的扩展之一。多亏了这个，我发现并改正了很多错别字。
此图显示拼写检查器如何检测和更正拼写错误。
代码快照
CodeSnap用于对代码进行屏幕截图。它可以方便地轻松共享代码片段。
要拍摄代码快照，请使用（Windows 和 Linux 上为 Ctrl+Shift+P，OS X 上为 Cmd+Shift+P）并搜索CodeSnap. 然后选择要截图的代码区域，调整宽度，然后单击快门按钮。您还可以通过选择代码、右键单击并选择 CodeSnap 来拍摄快照。
有些网站可以做到这一点，但是，在编辑器中使用这些工具可以减少上下文切换，从而提高工作效率。
使用 CodeSnap 创建的示例 React 代码片段。
CodiumAI
CodiumAI是一个免费的人工智能驱动的代码工具包。它支持代码自动完成、聊天、增强搜索和建议等功能。
人工智能已成为提高开发人员生产力的主要参与者。想象一下，您只需花费一半的时间来编写测试，从而可以将更多的时间花在其他重要的、创造性的任务上。
在测试方面，CodiumAI 表现出色。它可以分析代码并生成有意义的测试和全面的测试套件。
CodiumAI 基于一段 Python 代码生成测试套件。
这是一个相对较新的扩展，并且已迅速流行。支持的语言包括 Python、JavaScript、TypeScript、Java、Go 等。
CodiumAI 的自动完成功能用于根据自然语言提示创建函数。
Error Lens
Error Lens改进了错误、警告和其他语言诊断的突出显示。这是一个很棒的调试和防错工具。
此扩展不会忽视错误。通过突出显示整行以及内联打印的相关消息，可以使错误和警告更加突出。
错误镜头识别错误，通知缺少分号和语法错误。
花更少的时间寻找错误，因为单击注释会将您直接转至相应的代码行。
它支持多种语言，这对于使用不同语言的项目的开发人员来说非常有价值。您还可以配置错误和警告的外观和行为。
Git 历史
Git History是一个非常有用的 Git 版本控制扩展（该扩展有 1000 万次安装，所以很明显它很受欢迎）。此扩展允许您直接从 VSCode 界面探索 Git 存储库的详细历史记录。您可以查看文件历史记录、git 日志并执行比较。
它提供了提交日志、分支和文件随时间变化的交互式可视化表示。此扩展提供了处理版本控制项目的更易于访问且更简单的体验。
此处使用 Git 历史记录在特定提交上创建标签。
GitLens
GitLens是最强大的 Git 工具，在一个扩展中捆绑了如此多的功能。它拥有强大的开源社区，并持续获得频繁更新的积极支持。
借助 GitLens，您可以直接在 VSCode 中获得对存储库的深入了解。注释集成在整个编辑器中，显示大量的 Git 信息。
GitLens 最有用的功能之一是blame 注释。这使您可以查看谁编写了代码以及多久之前编写的。
GitLens 跟踪代码行到用户（您）4 年前创建的提交。
我发现另一个方便的功能是交互式变基编辑器。这在执行变基时提供了良好的用户体验。
GitLens 的交互式变基示例。提交可以被选取、编辑、删除、压缩等等。
GitHub Copilot
GitHub Copilot在过去两年中获得了巨大的关注。该产品利用先进的人工智能功能彻底改变了编码体验。它不仅可以帮助完成代码片段，还可以充当人工智能结对编程副驾驶，为整行或整段代码提供智能建议。
GitHub Copilot 的优势在于它与 OpenAI 的集成，利用庞大的开源代码存储库来提供与上下文相关的实用建议。这不仅可以加快编码速度，而且可以作为一种有价值的学习工具，让您接触到不同的编码模式和最佳实践。
这不是免费工具。个人订阅费用为每月 10 美元，团队也可以以折扣价购买。如果您想试用 GitHub Copilot，目前提供 30 天的试用优惠。
GitHub Copilot 在函数上使用智能自动完成功能。
还有一些免费的替代品，您可以在这里阅读更多信息（我也在下面讨论 Tabnine）。
图标主题
虽然 VSCode 包含默认图标，但合并图标包提供了一种极好的方法来提高工作效率并向编辑器注入视觉上吸引人的美感。
与默认图标相比，图标包提供了更广泛且视觉上可识别的图标集。这可以更轻松地在视觉上区分文件类型和文件夹。它可以建立直观的识别并减少浏览文件时的认知负担。
在选择图标包时有很多选择。三种流行的选择是Material Theme Icons、vscode-icons和file-icons。
我发现一组好的图标可以提高文件资源管理器的整体可读性。我很享受升级后的视觉体验所带来的额外好处。
我的编辑器与启用了 vscode-icons（左）和 Material Icon 主题（右）的并排比较。文件类型和文件夹有一些图标来指示它们包含的内容。
缩进
Indent Rainbow是一个丰富多彩的扩展，您可以使用它使缩进易于理解，有助于维护组织良好且正确缩进的代码。
每个缩进都标有不同的颜色，在 4 种不同的颜色之间交替。结构的彩色表现不仅有用，而且在视觉上也很有吸引力。此扩展对于严重依赖缩进的语言（例如 YAML 或 Python）特别有用。
如果您不喜欢默认的颜色集，您可以配置自己的颜色！
Indent Rainbow 的两种风格的并排比较。左边的一张以鲜艳的颜色显示了凹痕的线条，另一张则以柔和的色调显示了整个凹痕。
实时分享
Live Share是一种协作开发扩展，可实现实时共享。
扩展市场中的 Live Share 标头。安装量为 1500 万。
此扩展可帮助您促进高效的团队合作。与传统的结对编程会话不同，Live Share 允许您一起工作，同时保留您自己的编辑器首选项。每个人都有自己的光标，您可以在代码库中跟随彼此的光标。
使用 Live Share，在共享分支上工作时无需克隆存储库或遇到冲突。进入会话时，会立即从环境中获取上下文。
多光标大小写保留
多光标大小写保留扩展是一种提高工作效率的工具，有助于快速编辑代码。
我个人经历过在整个文件中针对多个变量名称进行重命名以及在进行更改时无意中覆盖大小写时的挫败感。
针对具有相同单词但大小写不同的多个变量，并将它们全部从“元素”更新为“节点”，同时保持大小写不变。
提示：VSCode 中的多行编辑
利用这些 Mac 键盘快捷键进行多行编辑：
- Cmd + D： 快速选择一个单词并再次按下该单词可将选择范围扩展到连续出现的单词。
- Alt + Shift + 向上/向下： 在光标上方或下方创建多个光标。用于
Cmd + Right/Left将每个光标导航到行尾或行首，以及Cmd + Left/Right到达单词的开头或结尾。 - Alt + 向上/向下： 向上或向下移动当前行。结合使用
Shift + Up/Down可以同时选择和移动多行，从而简化代码编辑过程。
通过保留大小写，它可以减少修复大小写所需的手动工作，从而简化编辑过程。
路径智能感知
Path Intellisense是一款文件路径生产力工具。它具有智能自动完成功能，可以在您键入时动态建议文件路径和目录名称。它可以最大限度地减少由于不完整或错误的文件路径而导致的错误。
路径智能感知用于使用 style.css 文件自动完成链接元素的“href”属性。
它与多种编程语言兼容。但如果您使用 npm，则特别推荐npm Intellisense插件。
Peacock
Peacock是我个人的最爱，因为我喜欢为我的编辑器添加更多色彩。它不仅以颜色勾勒出编辑器的轮廓，还允许您为每个工作区配置特定的颜色，这在上下文切换时非常有用。
Peacock 具有一系列预选颜色，同时还允许用户定义自定义颜色。
Peacock 的一堆编辑器显示了各种默认颜色选项。该颜色应用于编辑器窗口中的侧边栏和底部部分。
Prettier
Prettier是一种广泛接受的代码格式化工具，安装量超过 4000 万次。它为您提供了一个共享的解决方案来提高代码的可读性。
这种固执己见的代码格式化程序在整个代码库中强制执行一致的风格。通过支持各种编程语言，Prettier 可以根据一组标准化规则自动分析和格式化代码，从而消除了关于编码风格的争论并增强了协作。
Prettier 与 VSCode 中的“保存时格式化”集成，可自动应用格式化，从而避免将时间花在手动格式化问题上，从而极大地提高了工作效率。
您可能已经听说过 Prettier，尽管如此，作为顶级扩展之一还是值得一提。
专案经理
项目管理器是一个用于设置项目（也称为收藏夹）并访问它们的简单工具。它包括一个专用的侧栏部分，可在一个地方管理您的所有项目。
当您有很多项目需要管理并且需要在它们之间频繁切换时，这是一个很棒的工具。它配备了一系列方便的功能，例如通过标签进一步组织项目的能力。
项目经理的示例，说明如何通过选择“编辑标签”、从以前创建的标签中进行选择以及在“收藏夹”下的何处查看它们来创建标签。
Tabnine
Tabnine是一款免费的人工智能编码助手。它可以通过提供实时代码完成来帮助提高您的工作效率。
除了基本的代码完成之外，它还考虑上下文并提供进一步的相关建议。当在需要大量代码探索的复杂代码库中工作时，这尤其有用。
Tabnine 的自动完成示例。自动完成用于快速创建 Python 和 TypeScript 代码。
Tabnine 支持多种编程语言。自适应学习用于随着时间的推移调整开发人员的编码风格。由于代码从不存储或共享，因此更加注重隐私。
正如我上面提到的，Tabnine 经常被比作 GitHub Copilot 的替代品，值得免费尝试。请密切关注这一点，因为他们会添加新的竞争功能。
对该扩展的支持非常强大，并且不断更新。聊天功能即将推出，您可以提出问题并生成从代码到文档的任何内容。
Tabnine 中的示例展示了新的人工智能聊天功能的外观。用户请求天气 API，Tabnine 会用几个示例进行响应。
待办事项
使用TODO 突出显示，永远不会忘记其他待办事项。它TODO以彩色突出显示 s 和其他注释。
在已经存在了一段时间的代码库中遇到过去的遗留物是很常见的TODO。FIXME这些可能很难记住删除。TODO 高亮功能可帮助提醒您不要留下痕迹。
无论您的主题是浅色还是深色，TODO 高亮都会突出注释。
一些 JavaScript 代码，其中 TODO 以黄色突出显示，FIXME 以粉色突出显示。
Todo Tree
Todo Tree提供了一种快速且有组织的解决方案来发现注释。它会在您的工作空间中搜索TODO注释和其他注释，并将它们组织在文件树中。
它占据侧面活动栏中的特定部分。单击每个TODO文件将打开相关文件，其中TODO突出显示以供立即关注。
TODO 树侧边栏部分包含选定的待办事项“TODO 修复此问题！”。在右侧的代码中，“TODO”以亮紫色突出显示。
概括
VSCode 因其广泛的扩展生态系统而脱颖而出，使其成为开发人员的首选。在彻底测试了一系列流行的扩展之后，我精心策划了这份我的首要推荐列表。
该列表是一个很好的起点和基础。我强烈鼓励您实施带有新扩展的常规试用期。通过Visual Studio Code 扩展搜索深入研究其他扩展。
认识到最小化认知负荷对于持续专注的重要性，选择此列表中的每个扩展都是为了减少不必要的精神负担（例如上下文切换）。让 VSCode 成为您开发需求的主要中心，并为您提供改进的焦点模式以及其他好处。
我希望这些建议能够帮助您优化工作流程，最大限度地减少干扰，并最终提高您的工作效率！
