美文网首页
【分享】每个 Web 开发者在 2021 年必须拥有 15 个

【分享】每个 Web 开发者在 2021 年必须拥有 15 个

作者: 求知久久编程学院 | 来源:发表于2021-01-25 13:50 被阅读0次

    [图片上传失败...(image-ccb5b3-1611553802408)]

    为什么VSCode如此受欢迎

    Visual Studio Code在开发人员中迅速流行起来,它是最流行的开发环境,可定制性是其流行的原因之一。

    [图片上传失败...(image-c46969-1611553802408)]

    因此,如果你正在使用VSCode,这里有一个扩展列表,你必须提高你的工作效率。

    1. Git Lens

    当你与你的团队成员在一个项目上工作时,这个扩展使用VSCode的强大功能,帮助你可视化代码创作一目了然。

    它显示了特定代码何时提交或更改,以及是谁更改了它。

    有时,你的团队成员提交的代码可能会破坏项目的其他功能,这在那段时间是有帮助的。你可以在这里找到它。

    [图片上传失败...(image-502ef2-1611553802408)]

    2. Wallaby.js

    js是一个智能的JavaScript测试运行器,它可以持续运行你的测试。

    当您更改代码时(甚至不保存文件),它将直接向代码编辑器报告代码覆盖率和其他结果。

    这个扩展有助于提高您的开发效率。

    [图片上传失败...(image-124033-1611553802408)]

    3. TypeScript Hero

    TypeScript是JavaScript的一个超集,具有可选的类型,并可编译为纯JavaScript。

    当我们使用TypeScript时,这个扩展就派上用场了。它通过一个名为“灯泡”的功能对你的导入文件进行分类和组织,并修复编码错误。

    [图片上传失败...(image-95fd0b-1611553802408)]

    4. Prettier Code Formatter

    Prettier是一种固执的代码格式,它使开发人员在代码格式方面的工作变得更容易。

    您可以将其配置为保存时格式化,并在保存时格式化代码。

    一旦你有了这个扩展,你将永远不必担心格式化的代码。

    [图片上传失败...(image-8bf85-1611553802408)]

    5. Path Intellisense

    如果你在React或Angular等JavaScript库上工作,而且你在做大型项目,你就知道在导入时找到组件的确切路径有多烦人。

    这个扩展可以帮助你自动完成导入的路径。

    它还可以帮助您自动完成HTML文件中的文件引用。

    [图片上传失败...(image-3bcda1-1611553802408)]

    6. Debugger for Chrome

    我们都知道有时候调试是多么烦人,所以这个扩展被用来帮助你调试JavaScript代码。

    它是由微软开发的。我们可以设置断点、逐步执行代码、动态添加调试脚本等等。

    假设我们有一个不确定是否正在执行的函数,这个扩展可以通过在执行时在调试器中暂停来帮助我们。

    [图片上传失败...(image-c7c22f-1611553802408)]

    7. Bracket Pair Colorizer

    这个扩展允许匹配的括号被识别的颜色。

    当你在调试过程中处理一个巨大的代码库时,这个扩展就像救星一样。

    用户可以定义要匹配的字符和要使用的颜色。

    [图片上传失败...(image-ac14a2-1611553802408)]

    8. JavaScript (ES6) Code Snippets

    如果您是一名JavaScript开发人员,这可以为您节省大量时间。

    当你想快速构建新项目时,这可能会有帮助。

    它没有键入全部代码,而是为最常见的JavaScript函数预定义了许多代码片段。

    它支持TypeScript、React、Vue和HTML。

    如果你在React上工作,有一个类似的扩展。(ES7 React/Redux/GraphQL/React-Native snippets)。

    [图片上传失败...(image-3b448e-1611553802408)]

    9. Live Share

    当您与您的团队成员一起解决问题,并希望在编辑器上共同处理相同的代码时,这将帮助您将代码编辑器的控制权交给您的团队成员,您可以同时处理它。

    您还可以共享终端实例、本地主机web应用程序、语音通话等。

    [图片上传失败...(image-5d88bb-1611553802408)]

    10. ESLint

    由于JavaScript是一种高度灵活的语言,一些小错误可能会导致巨大的问题。

    因此,当工作在巨大的代码库,我们需要一个linter和一个格式化程序。

    这个扩展可以帮助你做到这一点。

    这可以自动格式化你的代码,并发现你的代码中的错误。

    实现ESLint规则会让你离为你的代码库建立良好的标准更近一步。

    [图片上传失败...(image-4ec36a-1611553802408)]

    11. Paste JSON as Code

    作为一名开发人员,您经常要处理api。

    众所周知,api中最常用的数据结构是JSON。

    为了避免一些可能破坏应用程序的类型错误,我们使用类或接口。

    这个扩展可以用JSON数据生成一个类。

    因此,与其手工编写类,我们可以使用它来节省创建类的时间和负担。

    这个扩展支持大多数流行的语言。

    [图片上传失败...(image-e21659-1611553802408)]

    12. Peacock

    当你在多个工作空间上工作时,这个扩展可以帮助你识别你已经切换到或工作的确切的工作空间。

    [图片上传失败...(image-12b17b-1611553802408)]

    13. Better Comments

    这个扩展可以帮助您在代码中创建更人性化的注释。

    它允许您为不同类型的注释提供不同的颜色代码,这些注释可以是TODOs、高亮显示、警报和其他类型的注释。

    这是强烈推荐的,用于编写干净和文档化的代码。

    [图片上传失败...(image-8b1b58-1611553802408)]

    14. Search node_modules

    当我们构建组件库并在不同的应用程序中使用该组件时,我们肯定会对节点模块进行一些修改。

    这个扩展允许你在项目的node_modules目录中快速浏览文件。

    [图片上传失败...(image-71ff07-1611553802408)]

    15. Rest Client

    作为开发人员,我们每天都会定期使用Postman来检查API的响应。

    这个扩展允许你做一个HTTP请求,并在VSCode中直接查看响应,而不是在两个应用程序之间切换,这个扩展为你做这个工作。

    [图片上传失败...(image-ddc67a-1611553802408)]

    其他精彩文章

    相关文章

      网友评论

          本文标题:【分享】每个 Web 开发者在 2021 年必须拥有 15 个

          本文链接:https://www.haomeiwen.com/subject/yinbzktx.html