市场上有数以千计的 VS Code 扩展。问题是如何决定使用哪一个?
好吧,这里有十几篇关于 Medium 的文章,介绍了哪些文章值得使用。然而,这些文章中的大多数都包含许多关于主题、装饰和外观的扩展。
这篇文章不是其中之一。这不是为了让您的编码会议更愉快或满足代码审查员的眼球。
这是一种收集基本扩展的尝试,这些扩展将使您的生活更轻松,开发过程更高效,团队的编码实践更加稳固和一致。
那么,让我们开始吧!
1. Turbo 控制台日志
console.log调试时打字累了?输入Turbo 控制台日志扩展!
这个扩展允许你通过简单地选择一个变量并按下来插入一个控制台日志Ctrl + Alt + L。瞧!
Turbo 控制台日志 — Visual Studio 市场
此扩展通过自动化编写有意义的日志消息的操作使调试变得更加容易。一)插入…
market.visualstudio.com
2. CodeMetrics
有没有想过您编写的代码有多复杂?输入CodeMetrics扩展!
此扩展计算并显示 TypeScript/JavaScript 文件的复杂性。它使用一个自定义度量,该度量非常接近Cyclomatic complex。
奖励:扩展是可配置的,这意味着您可以选择扩展在计算复杂度指标时所考虑的内容。
CodeMetrics — Visual Studio 市场
计算 TypeScript / JavaScript / Lua 文件的复杂度。计算步骤:从输入创建一个 AST……
market.visualstudio.com
3. 代码拼写检查器
担心源代码中的拼写错误或拼写错误?输入代码拼写检查扩展。
这个扩展是一个简单但有效的源代码拼写检查器。告别源代码中那些杂乱无章的错别字!
代码拼写检查器 — Visual Studio Marketplace
Visual Studio Code 的扩展——源代码的拼写检查器
market.visualstudio.com
4. CSS 窥视
想要从 HTML 文件中窥视或更轻松地导航到 CSS id 和类?输入CSS Peek扩展!
这个扩展就是这样做的。它允许查看 CSS id 和类字符串作为从 HTML 文件到相应 CSS 的定义。它还允许导航到相应的定义。
CSS Peek — Visual Studio 市场
我以前用过的一个很棒的工具,他们没有让我这么说:) — 扩展作者管理拉取请求和…
market.visualstudio.com
5. Prettier——代码格式化程序
需要格式化您的代码并在您的开发团队中强制执行一组格式化规则?输入更漂亮的代码格式化程序扩展!
这个扩展是一个固执己见的代码格式化程序。它通过解析您的代码并根据预定义的规则重新打印它来强制执行一致的样式。
除了格式化规则之外,您还可以配置如何使用它,无论是通过键入格式快捷方式还是在保存文件时自动。
Prettier — 代码格式化程序 — Visual Studio Marketplace
Visual Studio Code 的扩展——使用 prettier 的代码格式化程序
market.visualstudio.com
6. ESLint
想要的不仅仅是格式化代码,例如常见代码问题修复的建议?输入ESLint扩展!
此扩展将ESLint集成到 VS Code 中。ESLint 是一个 linter,它可以静态分析您的代码以快速发现问题并为潜在的修复提供建议。
ESLint 也是可配置的,并且与 Prettier 配合得很好。
ESLint — Visual Studio 市场
将 ESLint 集成到 VS 代码中。如果您是 ESLint 新手,请查看文档。该扩展使用 ESLint 库……
market.visualstudio.com
JS Essentials 扩展包
如果安装所有这些扩展对您来说似乎需要做很多工作,那么我已经为您服务了!只需安装 JS Essentials 扩展包,您就可以开始编写代码了!
我将把将来遇到的任何有用的扩展添加到这个扩展包中。如果您有任何扩展建议,请随时发表评论。
JS Essentials – Visual Studio 市场
JS Essentials 是一个最小的扩展集合,可以让你的生活更轻松,加快你的开发过程……
market.visualstudio.com
结论
在本文中,我们检查了每个 JavaScript 开发人员可能会发现有用的一些基本扩展。我们的重点是让我们的生活更轻松,而不是让 VS Code 看起来更漂亮。为方便起见,还提供了一个扩展包。

