5种最佳Visual Studio代码扩展

最新推荐文章于 2025-04-26 01:08:28 发布

weixin_26720549

最新推荐文章于 2025-04-26 01:08:28 发布

阅读量1.6k

点赞数

文章标签： python java

原文链接：https://medium.com/swlh/the-5-best-visual-studio-code-extensions-d4541edad882

版权

本文介绍了五个最佳的Visual Studio Code扩展，包括实时服务器、Prettier代码格式化工具、Bracket Pair Colorizer括号着色器、Code Spell Checker代码拼写检查器以及Turbo Console Log，这些扩展能提升开发效率，方便调试。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.实时服务器(1. Live Server)

Live Server is a must for any developer. This should be the first extension any beginner downloads. After installing, you will will see a small “Go Live” button on the bottom of your Visual Studio Code window:

对于任何开发人员来说，Live Server都是必须的。这应该是任何初学者下载的第一个扩展。安装后，您将在Visual Studio代码窗口的底部看到一个小的“ Go Live”按钮：

Write some code in an html file, press this button, and see some magic! (Alternatively, you can right-click within your html file, and select “Open with Live Server”). This will open your current file on your default browser, so you can see what your code outputs. Whenever you save a change in Visual Studio, the change will appear live on your browser.

在html文件中编写一些代码，按此按钮，然后看一些魔术！ (或者，您可以右键单击html文件，然后选择“使用Live Server打开”)。这将在默认浏览器中打开当前文件，因此您可以查看代码输出。只要将更改保存在Visual Studio中，更改就会实时显示在浏览器中。

2.更漂亮 (2. Prettier)

This is by far my favorite extension. Prettier is a code formatter that saves you so many hours of tedious formatting. When I first started coding, I had a misconception that if I wasn’t doing everything myself (indenting, adding semi-colons, etc.), that I was cheating. Wrong. Prettier has not only saved me time, it has taught me better practices for formatting and making my code legible. You can configure settings within Visual Studio (in your settings.json) or make a configuration file for each project. Check out this article for more details on configuration: https://www.robinwieruch.de/how-to-use-prettier-vscode. However, I encourage EVERYONE to place this piece of code in their settings.json:

到目前为止，这是我最喜欢的扩展。 Prettier是一种代码格式化程序，可为您节省许多小时的繁琐格式化工作。刚开始编码时，我有一个误解，即如果我自己不做任何事情(缩进，添加分号等)，那我就是在作弊。错误。 Prettier不仅节省了我的时间，还教会了我更好的格式化和使代码清晰易懂的做法。您可以在Visual Studio中(在settings.json中)配置设置，或为每个项目制作一个配置文件。请查看本文以获取有关配置的更多详细信息： https : //www.robinwieruch.de/how-to-use-prettier-vscode 。但是，我鼓励所有人将这段代码放在他们的settings.json中：

“editor.formatOnSave”: true

This will allow Prettier to automatically format your code every time you save. I promise you will never look back.

这样，Prettier每次保存时都会自动格式化代码。我保证你永远不会回头。

3.支架对着色器 (3. Bracket Pair Colorizer)

This is an extension that seems mildly helpful at first, but can be a lifesaver when it comes to debugging. All programmers know the struggle of trying to figure out where you went wrong when your brackets, parentheses, and braces don’t match. Bracket Pair Colorizer does exactly as the name suggests, and gives your brackets different colors. Unlike some other extensions, there’s no learning curve or cons with this. So help your future debugging efforts and download it!

这是一个扩展，起初似乎没有多大帮助，但在调试时可以成为救生员。所有程序员都知道在方括号，括号和花括号不匹配时试图弄清楚哪里出了问题的努力。括号对着色器的功能与名称完全相同，可为括号提供不同的颜色。与其他一些扩展不同，它没有学习曲线或缺点。因此，请帮助您将来进行调试并下载它！

4.代码拼写检查器 (4. Code Spell Checker)

Nothing wild here, this is literally just a spell checker for your code. After you spend 30 minutes debugging, only to find you misspelled a word, you’ll wish you had this. Code Spell Checker underlines misspelled words and will save you headaches down the line.

这里没什么大不了的，这实际上只是代码的拼写检查器。在花了30分钟进行调试之后，才发现您拼错了一个单词，便希望您拥有了这个单词。 Code Spell Checker强调了拼写错误的单词，将使您免于头痛。

5. Turbo控制台日志 (5. Turbo Console Log)

Turbo Console Log is the only extension on this list that I wouldn’t consider necessary, but I do really enjoy it. This is yet another tool to help with debugging (notice a theme here?). If you’re someone that finds yourself writing console logs 50 times trying to locate an error, this extension will help you out. Highlight a variable, press CTRL + ALT + L (or CMD + OPT + L on a Mac) and have a nice console log message with the highlighted variable outputted for you. You can even customize the message in its settings.

Turbo Console日志是此列表中唯一不需要的扩展名，但我真的很喜欢它。这是另一个有助于调试的工具(请注意此处的主题吗？)。如果您发现自己写控制台日志50次试图查找错误，那么此扩展程序将为您提供帮助。突出显示一个变量，按CTRL + ALT + L(或在Mac上为CMD + OPT + L)，并显示一条漂亮的控制台日志消息，并为您输出突出显示的变量。您甚至可以在其设置中自定义消息。

The more I code, the more I find myself wanting extensions to do the dirty work for me. These are my 5 favorite extensions, but I am always on the hunt for more. Let me know if I missed any in the comments below!

我编写的代码越多，我发现自己越想要扩展为我做些肮脏的工作。这些是我最喜欢的5个扩展，但是我一直在寻找更多扩展。让我知道是否错过以下评论！

翻译自: https://medium.com/swlh/the-5-best-visual-studio-code-extensions-d4541edad882