23个最佳VS代码扩展，适用于开发人员

Visual Studio Code，简称VS Code，是开发者使用最多的流行源代码编辑器之一。

VS Code 是一个由Microsoft开发和维护的免费开源代码编辑器。这个代码编辑器具有诸如 version control 集成、代码补全和语法高亮等广泛的功能。它也是一个跨平台的代码编辑器，可在Windows、macOS和Linux上使用。

为了提高软件开发项目的生产力，您可以使用本文中提到的一些最佳VS Code扩展。

在Visual Studio Code上开始编辑软件或网页源代码时，您会获得令人惊叹的开箱即用体验。然而，作为开发者，您总是可以在这个近乎集成的开发环境（IDE）code editor中要求更多的功能。

VS Code Marketplace应该是您寻找各种VS IDE扩展的首选目的地。继续阅读本文，找到您可以在Web或Windows应用程序开发项目中使用的最佳VS IDE扩展。

Visual Studio Code的流行程度

根据编程统计数据，开发者已经在VS Code编辑器上使用了超过2100万小时。与其他工具如IntelliJ（>3百万小时）和PhpStorm（>2百万小时）进行代码编辑的小时数相比，它是2021年的第一款代码编辑器。

以下是大多数开发者选择VS Code而不是其他源代码编辑器的原因：

#1. 它完全免费、开源，并具有跨平台的支持能力。这意味着它可以在Linux、Windows和macOS上运行。

#2. 该编辑器具有内置的调试器。因此，您需要点击的次数更少。此外，您可以在一个窗口中同时查看编码项目和调试器，而无需切换应用程序。

#3. VS Code自带的IntelliSense，也称为预测性编码。

#4. 您可以通过正确的快捷键、VS Code扩展和设置轻松将VS Code应用程序转换为全功能工作站。

什么是Visual Studio IDE扩展？

VS Code是一个超级整洁的源代码编辑器，支持软件和 app development等操作，如版本控制、debugging和任务运行。

它为开发者提供了一个高效的平台，以轻松进行大多数编程语言的代码构建和调试循环。然而，对于复杂的工作流程，您将需要像Visual Studio这样的IDE。

为了弥补不足，开发者们提出了VS Code扩展。扩展只是您可以安装在VS Code应用程序中的附加组件，从而可以访问新的功能。VS IDE扩展主要提高生产力，使编码更加简便和无缺。

为什么IDE扩展很有用？

主要来说，您可以使用VS Code扩展来增强工具在各种软件和应用程序开发项目中的可用性。如果项目需要VS Code缺少的任何特定功能，您可以在市场上搜索扩展。

此外，扩展可以帮助您增加应用程序开发团队的生产力。通过使用 code completion 扩展，您可以避免在编码过程中出现不必要的错误。

此外，还有一些高级扩展包安装程序，可以帮助您从 package hosting sites 导入DevOps项目的存储库。简而言之，扩展允许您将VS Code转换为全功能IDE。

现在让我们来看一些最好的VS代码编辑器。

实时服务器

Live Server 是最常用的VS Code扩展之一，在市场上已经下载了超过3090万次。根据名称，实时服务器在您的计算机上创建一个本地服务器，并允许您在编写代码时查看代码的更改。

不需要每次编辑代码时都刷新浏览器，Live Server可以自动化该过程，使您能够实时查看更改。

主要功能

• 跨浏览器测试：您可以在链接_9，Mozilla Firefox，Apple Safari和Microsoft Edge上使用LiveServer。
• 选择性更改跟踪：您可以选择要在LiveServer上跟踪的文件。
• 可用于通过HTTP提供的任何技术：您可以在HTML、CSS、JavaScript和JavaScript框架（如Angular、Vue和React）中使用LiveServer。

您可以通过在市场上搜索并键入live server来安装该扩展。然而，有几个同名的扩展，最好的选择是选择评分和下载量较高的扩展。

REST客户端

这个VS Code扩展允许软件工程师在代码编辑器中发送HTTP请求并接收返回消息。市场上最著名的链接_10已经拥有超过310万次下载。

主要功能

• 各种身份验证支持：REST Client支持Digest Auth、Basic Auth、Azure Active Directory、SSL客户端证书和AWS Signature v4。
• 支持单个文件的多个请求：您可以使用###分隔符在同一文件上组成不同的HTTP请求。
• Cookie记忆：REST Client存储Cookie，便于执行后续请求。
• 支持系统变量：此扩展允许开发人员在URL、Headers和Body中使用变量。

REST Client不特定于语言，因此开发人员可以将其与任何支持HTTP请求的语言一起使用。

图像优化器

图像等视觉元素使网站更具吸引力。链接_11提供了各种工具，开发人员可以使用这些工具来优化JPEG、PNG和GIF。

该扩展同时支持无损压缩（压缩图像而不丢失任何信息）和有损压缩（压缩图像会丢失一些原始数据）。

主要功能

• 批量图像优化：您可以手动选择要批量优化的图像，或者选择整个文件夹。
• 可配置设置：链接_12允许您确定图像的压缩级别。
• 提供图像预览：您可以在接受更改之前预览所有图像。
• 与构建过程集成：您可以将此扩展与构建过程集成，在将图像移动到生产环境之前进行优化。

图像优化器可以用于涉及图像的任何项目，它不是特定于语言的。

GitHub扩展

GitHub是代码存储、管理、跟踪和协作最常用的平台。链接_13允许开发人员跟踪更改、管理代码并与他人协作。

主要功能

• 与GitHub的简单连接：团队资源管理器部分有一个按钮，可以让您连接到GitHub。该扩展还支持双因素身份验证（2FA）。
• GitHub资源管理器：您可以通过这个树管理和导航GitHub上的所有存储库。
• Pull Request管理：开发人员可以从此扩展中查看、创建和管理Pull Request。
• 代码审查：您可以从此扩展中查看代码历史、对更改进行评论并比较不同的文件版本。
• 问题管理：开发人员可以从GitHub扩展中查看和管理问题。

GitHub Extension for Visual Studio仅适用于Visual Studio 15及以上版本。

PostSharp

PostSharp是一个扩展，允许开发人员编写更短、更清晰的代码。该扩展的特点是最常见的.NET预定义模式，允许您自动化自己的模式。

关键特点

• 面向方面的编程：该扩展使用System.Reflection API在构建时帮助您验证代码。
• PostSharp日志记录：PostSharp允许开发人员为其应用程序添加全面和可定制的日志记录。
• PostSharp缓存：与Redis和MemoryCache集成，允许开发人员为现有方法添加缓存。
• PostSharp线程：该扩展允许开发人员在正确的抽象级别上处理多线程。开发人员可以检测和诊断死锁，并降低线程带来的复杂性。

PostSharp是一个商业产品，有免费版本，PostSharp Essentials。

Visual Assist

Visual Assist是一个提高代码生成、导航、重构和编码辅助的生产力工具。该扩展专为C/C++和C#语言设计，但在某种程度上也支持Python、JavaScript和VB。

关键特点

• 代码生成：您可以使用”Create from Usage”、”Implement Interface/Virtual Methods”和”Add Missing Case Statements”等命令生成代码。
• 代码重构：重命名、更改签名、封装字段和引入变量等命令使开发人员可以重构其代码。
• 简便导航：使用”Open File in Solution”和”Find Symbol in Solution”等命令，可以导航到项目中的文件。

Visual Assist是一个付费工具，有30天的免费试用期。试用期结束后，一些功能将被禁用，直到您购买249美元/用户起的许可证。

CodeMaid

CodeMaid是一个清理和简化代码编写过程的扩展。它支持多种语言，如JavaScript、HTML、CSS、TypeScript、PHP、C、C++、C#和JSON。

关键特点

• 代码清理：CodeMaid帮助清除代码中的不必要的空格，并使用语句帮助您删除不需要的代码行。
• 代码重组织：该扩展允许您重新组织代码，以符合您自己的偏好或Microsoft的StyleCop约定。
• 代码浏览：该扩展提供了一个树形视图层次结构，使您可以轻松地可视化和浏览代码。
• 注释格式化：该工具允许开发人员格式化代码注释，使其易于阅读。

CodeMaid是开源的，并且在撰写本文时支持VS2019和VS2022。

GitLens

GitLens是一个帮助您更好地理解代码的扩展。借助该扩展，您可以了解代码的何时和为什么被更改。

关键特点

• 全面的代码历史：GitLens详细解释了代码的演进过程。
• 包含Code Lens：该工具向代码添加信息，如测试状态、符号和引用，使其可读性和可管理性更强。
• 有责备注释：通过GitLens的责备注释，您可以知道最后一次提交和更改代码库的人。
• 仓库导航：您可以从代码编辑器中导航到代码库并在分支之间切换。

GitLens是免费软件，尽管购买许可证后才能使用某些功能。该扩展可以支持任何使用的Git仓库，无论所使用的编程语言是什么。

Giflens

Giflens是一个扩展，允许用户可视化，无缝探索和浏览GIF资源库。用户可以通过悬停来可视化GIFLENS标签。

主要特点

• GIF预览：无需打开其他程序，Giflens允许您在VS Code中查看GIF。
• 速度控制：您可以自定义GIF在代码编辑器上播放的速度。
• 多个GIF支持：您可以比较不同的GIFs，因为此扩展允许您同时打开不同的GIF。

Giflens是一个免费的扩展，可以与带有动画GIF的任何代码文件一起使用。

Docker

Docker是一个VS Code扩展，它使构建，管理和部署容器化应用程序变得简单。该扩展具有令人惊叹的功能，允许工程师在代码编辑器中使用Docker容器，镜像和注册表。

主要特点

• 允许编辑Docker文件：您可以在编辑Docker文件和docker-compose.yml文件时利用其语法帮助和代码补全的智能感知功能。
• Docker资源管理器：您可以使用此扩展管理和检查所有Docker资产，例如卷，网络，容器，镜像和容器注册表。
• 强大的Docker命令：您可以直接从命令面板管理网络，卷，镜像，镜像注册表和Docker Compose。
• Docker Compose：在使用docker-compose.yml文件时，Compose Language Service提供了标签完成和智能感知功能。

Docker是免费且开源的。Docker扩展适用于Web开发和服务器端应用程序，并适用于大多数编程语言。

VsVim

VsVim是一个针对具有Vim经验的用户的扩展，因为它在VS Code中添加了Vim仿真（Vim是一款非常受系统管理员和软件工程师欢迎的命令行文本编辑器）。

主要特点

• Vim仿真：开发人员可以使用此扩展在VS Code上执行他们最喜欢的Vim命令。
• 多光标：使用此功能，您可以在不同位置/文件中进行相同的编辑。
• 高度可定制：开发人员可以使用此扩展禁用特定的Vim命令。
• 支持可视模式：开发人员可以像Vim一样操作和选择文本。

VsVim是免费的，不限制语言，并且可以与不同的VS Code文件一起使用。

Settings Sync

Settings Sync是一个扩展，允许用户使用GitHub Gist在不同的计算机之间同步设置，扩展，主题，工作区，片段和键绑定。

主要特点

• 提供云存储：您可以将所有设置和同步内容存储在云端，并在需要时检索。
• 自动同步：更改会自动在不同的计算机之间同步。
• 与GitHub集成：您可以将所有设置存储在GitHub上的公共或私有存储库中。

SettingSync是免费的，并支持使用不同语言创建的文件。

Remote – SSH

Remote – SSH是一个用于VS Code的附加组件，它允许您将任何带有SSH服务器的远程PC用作IDE。它将极大地提升在各种情况下的故障排除和开发能力。

主要特点

• 通过访问本地计算机，可以在高级remote workstation上开发应用程序和软件。
• 在不影响本地计算机性能的情况下，快速切换不同的开发环境。
• 从多个远程机器上协作使用现有的IDE。

最好的部分是您无需在本地工作站上部署任何源代码。该附加组件直接在远程计算机上运行命令和其他VS IDE扩展。

Prettier

如果您想在团队的所有开发项目中实施通用的样式指南，您必须尝试VS Code的 Prettier 附加组件。

主要特点

• 有见解的代码格式化扩展
• 与许多代码编辑器集成
• 使用此工具时，样式讨论变得无用
• 它节省您的时间和精力

有时，作为开发人员，您可能需要处理不一致的代码库。您可以使用VS Code上的此扩展轻松清理和重新格式化现有的代码库。

npm

如果您在JavaScript项目上工作，您必须尝试 npm 作为软件包管理器。现在，当您需要将工作转移到VS Code编辑器时，您可以做到这一点，因为npm扩展可以让您像其他IDE一样在VS Code编辑器上享受npm的支持能力。

这是一个由Microsoft开发的VS Code扩展，已安装了超过500万次。

项目管理器

如果您是软件开发项目经理，并在VS Code上监督多个DevOps项目，您应该尝试 Project Manager 。该工具使您能够从一台计算机访问所有项目，而不管项目在哪里可用。

有规定定义项目，以便您可以轻松组织它们。

主要特点

• 将文件夹或工作区保存为项目
• 为高级组织标记您的项目
• 在新窗口或同一窗口中打开所有项目
• 轻松识别重命名或已删除的项目

此外，该扩展已经有超过200万次的安装。

SonarLint

SonarLint 是一款开源的Visual Studio扩展，允许您在问题出现之前修复代码问题。该附加组件会在您在Visual Studio中编写代码时突出显示安全漏洞和错误。其界面简单，就像任何文本编辑器中的拼写检查应用程序一样工作。

此外，该工具为您提供了清晰的解决方案指导。因此，您可以在工作流提交到程序之前修复代码。此外，VS Code的扩展支持不同的编程语言分析，如C ++，C，Java，HTML，PHP，JavaScript，TypeScript和Python。

Stylelint

您是否正在寻找一种自动工具，可以在VS Code上标记编码错误、样式错误、错误和其他可疑结构？您可以尝试 Stylelint，这是一个易于安装的VS Code linter扩展。

除了标记之外，它还强制您的开发团队遵守预先批准的代码样式约定，以避免在软件或应用代码中出现垃圾和无用代码。

主要特点

• 支持插件以创建个性化规则
• 针对现代CSS功能和语法，具有170多个内置规则
• 有时，它可以在理解任何模式时自动修复代码问题

VS Marketplace显示此附加组件的安装量为70万。

CSS Peek

您是否想摆脱需要切换到.css文件以检查附加到id或class的属性的困扰？您需要尝试VS Code的 CSS Peek 附加组件。它允许您从HTML文件中查看CSS代码的悬停图像。

该扩展还将ID和类名转换为超链接。因此，当您点击这些超链接时，您可以立即访问CSS的ID定义和类。

该附加组件已经安装了超过300万次。您可以免费将该工具安装到VS Code中。

Polacode

Polacode 是一个用于VS Code的插件，可以让您立即创建漂亮的 screenshots 来展示您的软件或应用代码。然后，您可以使用生成的组件与合作者、朋友或客户分享您的编码工作。

最棒的部分是它保留了所有现有的VS Code主题和代码字体。这个插件只是将代码放入一个漂亮的布局中，看起来很专业。

该扩展提供了一个拖动功能，可以调整容器或代码片段的大小。您只需按住并拖动右下角即可。其他可用于控制图像外观的命令包括polacode.shadow、polacode.target、polacode.backgroundColor等。

Import Cost

Import Cost 是一个VS Code插件，可以让您可视化导入的第三方库的文件大小。在您在VS Code编辑器中导入库时，它会立即显示导入成本的值。

您将在键入代码时即时看到库的大小。为了查看导入的库文件大小，它利用了webpack。

主要特点

• 整个内容导入的库大小
• 默认导入的视图大小
• 与TypeScript和JavaScript编程语言兼容。

这个插件已经记录了超过100万的安装。

Path Intellisense

通常，在软件或应用开发项目中，您需要处理多个文件。当编写代码时，您需要根据自己的记忆输入文件名。

现在，由于文件名包含连字符，记住它们变成了一项具有挑战性的任务。在这里，您可以快速从 Path Intellisense 获得帮助。

这是一个在代码库中自动完成文件名的扩展。当检测到初始字母时，该工具会立即建议您要查找的文件。它还可以帮助您显示隐藏文件。

JavaScript Debugger

它是一个基于调试器适配器协议（DAP）的 JavaScript debugger。该工具可以让您调试Chrome、Node.js、WebView2、Edge、VS Code插件等等。自VS Code 1.46版本以来，JavaScript Debugger一直是默认的调试插件。微软还正在逐步将该工具推出到Visual Studio IDE。

这个VS Code插件是微软的开源工具。您可以自由地将其用于商业或非商业开发目的。到目前为止，该工具已经记录了超过60万的安装。

最后的话

到目前为止，您已经发现了一些最好的VS Code扩展，如果您喜欢在Microsoft Visual Studio Code上工作，那么您一定会喜欢它们。它是开源代码编辑器生态系统中的领先者。根据您的项目需求，您可以安装以上任何一个VS IDE扩展。

这个最佳VS IDE扩展的终极列表将帮助您节省搜索这些工具所需的时间。现在，您可以将更多的时间用于项目，因为您已经知道哪些扩展是好的。

您还可以查看一些每个程序员都应该了解的 best IDEs 。

合著者：Titus Kamunya