6 款赋予你超能力的 VS Code 扩展程序 🦸♂️
GitLens
更好的评论
Prettier - 代码格式化工具
Quokka.js
书签
ESlint
额外内容：REST客户端
概括
由 Mux 主办的 DEV 全球展示挑战赛：展示你的项目！
作为一名 Web 开发人员，你一天的大部分时间都花在 IDE 前。我选择的是微软的Visual Studio Code。它的一大优点是，你可以安装许多扩展程序，其中很多都能极大地简化你的工作。
以下是我最喜欢的一些扩展程序，它们有时会让你感觉自己拥有超能力，而且这些扩展程序都直接加载到你的代码编辑器中。
GitLens
当你在团队中使用 Git 时（你应该这样做），可能会出现关于特定代码作者的问题。“我完全不知道这里发生了什么，我想和作者谈谈，弄清楚一些事情。”
GitLens 的其中一项功能就是直接在代码中实现这些操作。它还有许多其他功能，例如代码热图、强大的提交/比较/暂存/历史记录命令，以及用于查看仓库、文件历史记录、比较等的丰富侧边栏视图。
🦸♂️ 它赋予你的超能力：你可以直接在代码编辑器中查看代码库的内核。
更好的评论
对于包含大量注释的长文件，区分不同类型的注释（例如待办事项、重要、已高亮、问题）会很有帮助。此扩展程序为您的编辑器添加了这种直观的颜色编码——无需任何配置。
🦸♂️ 它赋予你的超能力：让你拥有鹰眼般的洞察力，看到必看的评论。
Prettier - 代码格式化工具
👉 Prettier - VS Code 市场上的代码格式化工具
如果不使用代码格式化工具，你很可能每天都会因为缩进错误而产生或找不到 bug。保持代码整洁、间距合理/缩进正确，对开发人员的心态和团队协作都大有裨益。
Prettier 可以让你以可自定义的方式格式化代码。例如：
- 分隔符应为宽度为 4 的空格。
- 括号和其内容之间请使用空格。
- 代码行长度不应超过 80 个字符。
- 将双引号转换为单引号
- 自动在行尾添加分号
🦸♂️ 它赋予你的超能力：只需轻轻一弹指，就能将杂乱的代码转换为统一、优美的代码（无需任何特殊能力）。
Quokka.js
在了解这些扩展程序之前，如果我想快速尝试一些 JavaScript 代码，我通常会打开 Chrome 开发者工具。而 Quokka 提供了一个临时的 JavaScript 代码测试平台，让你无需离开编辑器即可进行代码测试。
🦸♂️ 它赋予你的超能力：创造一个安全的泡泡来测试你的代码，而不会影响外界。
书签
如果你处理的是较大的文件，需要在不同位置之间切换，并且需要在 Vue.js 中频繁切换（例如，如果你同时编写 JavaScript 和模板），你将不得不滚动页面（而且无法立即找到）你正在处理的其他部分。
书签功能允许您为每行代码设置书签，以便您可以快速切换到下一行重要的代码。
🦸♂️ 它赋予你的超能力：瞬间移动到下一行相关的代码。
ESlint
编写 JavaScript 代码很容易，因为它是一种容错性很高的语言（大多数情况下）。但是，仍然存在一些错误、误用和疏忽，引擎不会报错，但这些错误和疏忽是不应该发生的。
VS Code 中的 ESLint（作为最流行的 JavaScript 代码检查工具）会在代码执行前发出语法错误、可疑结构、风格错误和其他错误警告。它具有高度可配置性，可以帮助您成为更优秀的开发者。
🦸♂️ 它赋予你的超能力：让你在编写代码时就能敏锐地察觉到糟糕的代码。
额外内容：REST客户端
它不会赋予你超能力，但却是你工具箱里非常实用的工具。
编写后端代码时，你很可能需要暴露一个 API 供后端使用。有时，你只想快速向 API 发送请求，而无需启动 Postman（或其他 REST API 客户端）。
这款扩展程序让你只需在空白文件中快速编写代码即可完成操作，然后就可以开始使用了。响应结果会在另一个标签页中以分屏形式显示。它甚至允许你保存常用请求的代码片段。
概括
市面上有很多优秀的扩展程序，这只是冰山一角。如果您感兴趣，可以访问Visual Studio Code Marketplace，那里还有更多精彩的扩展程序等着您。
照片由Esteban Lopez拍摄，来自 Unsplash
文章来源：https://dev.to/themarcba/6-vs-code-extensions-that-give-you-superpowers-og1