面向生产性开发人员的前40多个[免费] VS代码扩展

微软公司的Visual Studio Code(VS Code)已使IntelliJ(获得它?!Eclipsed…)超越了市场上领先的IDE。 在2019年接受stackoverflow调查的开发人员中,有超过一半表示他们将VS Code作为主要开发环境。 当然,有些人仍旧喜欢Eclipse和Emacs等旧的收藏。 我们不判断。 VS Code越来越受欢迎,主要是因为它是一个真正的IDE平台,考虑到扩展性而构建。

这很快就导致了活跃的扩展市场,这些扩展向免费代码编辑器添加了功能,从而使VS Code适用于越来越多的编码器,并且对越来越多的编码器有用。 似乎连苹果迷们都勉强跳上了VS Code潮流。

显然,拥有如此广泛的Visual Studio Code扩展选择才是VS Code的原因。 通过安装实际上不需要的过多扩展程序来避免过度使用布丁的挑战。

为了帮助您选择将带来更多价值的扩展,而不是从系统中获取的资源,我们创建了这份当今最佳扩展的详尽清单。 虽然其中一些是众所周知的且通常安装的,但另一些是使用Visual Studio Code的经验丰富的开发人员向我们推荐的隐藏的宝石。

vos代码归ms meme所有

2020年排名前43的VS Code扩展

1. LiveServer

此扩展程序将启动本地开发服务器,以启用静态和动态页面的实时重新加载功能 。 您可以将其配置为在保存当前工作后自动重新加载页面。

2. TabNine

TabNine是您的多语言AI编码助手。 TabNine基于GPT-2模型,使用机器学习来帮助您更快更好地编写代码 。 只需安装并开始输入即可,无需进行任何配置。 AI通常会在10毫秒内自动完成代码。

3. 实时分享

如果您倾向于在代码上进行协作,则此VS Code的官方Microsoft扩展名是您所需要的。 它允许即时共享当前项目以及调试会话,终端实例,使用localhost的Web应用程序等

4. Quokka.js

Quokkajs

Quokka.js是JavaScript实时暂存器 。 它实时检查您JavaScript代码,并让您知道哪些块已执行,哪些块未执行。

5. 代码拼写检查器

错别字造成了特别烦人的错误。 此扩展可以通过在代码中强调拼写错误来防止这种特殊类型的烦恼。 Code Spell Checker可以很好地与camelCase代码配合使用,同时保持较低的误报率。

6. 自动关闭标签

自动关闭标签

Web开发中常见的另一种特别令人不快的错误类型是开放标记。 顾名思义, 自动关闭标签会自动关闭标签 。 当您打开<p>之类的标签时,</ p>会立即添加,并且光标会位于两者之间。

7. GitLens

VS Code附带了Git支持。但是,如果要增强它的功能,GitLens帮助会添加一些功能,这些功能可帮助您可视化,导航和更好地了解项目的Git历史记录

8. GitHub扩展

如果您倾向于在GitHub上工作很多,那么Microsoft已经为您服务。 使用GitHub扩展,您可以克隆,创建或发布存储库,而无需退出VS Code

9. 更漂亮

你以为你自以为是?! 查看Prettier,因为它很可能对您的代码有所批评。 它通过使用自己的规则重构代码来实现一致的样式,该规则考虑了最大行长,并在必要时包装代码 。 建议您将其与ESLint结合使用,以确保它遵循您自己的棉绒配置。

10. 美化

美化

Beautify 是Prettier替代产品 ,它将重新格式化用Javascript,JSON,Sass,CSS和HTML编写的代码。

11. 材质图标主题

通过此有用的扩展, 将Material Design图标添加到VS Code。

12. ESLint

ESLint

保持代码干净和一致的另一个扩展是ESLint。 ESLint涵盖了代码质量和编码样式问题, 是一种静态代码分析工具,用于识别代码中有问题的模式

13. 支架对着色器

确实按名称所述,并为成对的括号上色,以便于识别嵌套的组件括号对 。 它在屏幕上看起来也很有趣而且色彩丰富,可以完全自定义。

14. 颜色突出显示

您是否在前端开发中将十六进制值用于颜色,并且不会自动将十六进制转换为头部阴影? 然后,您需要此扩展程序以在VS Code编辑器中突出显示Web颜色

15. 拾色器

颜色选择和分配的另一个有用扩展是颜色选择器,它添加了UI选项以生成颜色代码

16. TODO要点

待办事项

在代码注释中留下注释并不是一个坏习惯。 但是,它们很容易被忘记和忽略。 为确保您不会,这个方便的扩展程序将为您突出显示注释

17. 更好的评论

好的注释通常会在可维护的代码和巨大的混乱之间产生区别。 此扩展名完全符合名称要求,它使您可以将注释分类为警报,查询,TODO,突出显示等内容,从而使注释更加人性化

18. 遥控器–集装箱

容器已在开发中流行,如果您使用远程容器,则此扩展适合您。 它提供了完善的工具和定义明确的运行时堆栈,可用于直接从VS Code UI容器化程序

19. 路径智能感知

Path Intellisense是一个Visual Studio Code插件,可以自动完成文件名 。 它将Intellisense样式的完成功能添加到文件名中,使您轻松键入长路径名。

20. 路径自动完成

路径自动完成

与Path Intellisense相似,此扩展为VS Code 提供了路径完成功能 ,因此您不必记住那些长路径。

21. 设置同步

如果您在多台计算机上工作,或者只是想备份VS Code设置和首选项,则应该安装“设置同步”扩展程序。 它使您可以使用简单的Gist跨计算机同步设置,摘要,主题,文件图标,键绑定,工作区和扩展

22. Chrome调试器

chrome-debugger-demo

该扩展是前端开发人员的必备功能。 它使您可以直接在VS Code环境中在Google Chrome浏览器 (或支持Chrome DevTools协议的其他目标)中调试前端代码。

23. 浏览器预览

手动启动众多不同的浏览器以预览跨平台的更改可能会很麻烦。 浏览器预览可能会有所帮助。 此扩展在编辑创建可调试的真实浏览器预览

24. JavaScript(ES6)代码段

JavaScript(ES6)代码段

代码段是保存击键的好方法。 该扩展包含 VS Code编辑器的ES6语法JavaScript代码片段 (同时支持JavaScript和TypeScript)。

25. ES7,React,Redux和GraphQL片段

该扩展为您提供了带有Babel插件功能的ES7中JavaScript和React / Redux代码片段的另一个集合

26. Reactjs代码片段

用于ES6语法的Reactjs开发代码片段的集合,该代码片段来自最初为Sublime文本编辑器创建的集合。

27. 进口成本

此扩展名可以帮助您检查捆绑包的大小。 它将在编辑器中内联显示导入/需要包的大小

28. 文件大小

文件大小

您的代码有多胖? 此扩展程序可以帮助您查找。 该扩展名在编辑器的状态栏中显示聚焦文件的大小 。 如果单击状态栏组件,它将显示有关文件的更多信息。

29. 自动重命名标签

非常简单地自动重命名配对的HTML / XML标签

30. TinyPNG

如果您的项目具有大量视觉资产,则可能需要压缩它们。 此扩展使用TinyPNG API 直接在VSCode内部压缩JP(E)G和PNG图像

31. 图像优化器

替代TinyPNG的是Image Optimizer, 除了JPEG,PNG文件格式外 ,它还支持动画GIF压缩

32. 代码时间

代码时间工作与生活的平衡

被编码任务吞噬很容易。 很难意识到您已经呆了多长时间。 此扩展将帮助您跟踪和了解在各种编码任务上花费的时间 。 是的,它需要您创建一个帐户,但是值得花几分钟时间创建一个帐户,以便从长远来看可以优化您的时间管理。

33. Turbo控制台日志

该扩展旨在自动执行有意义的日志消息的过程,从而使调试工作更加轻松。

34. NPM

vs代码的npm扩展

如果您使用Node.js,则必须具有此扩展名。 节点软件包管理器可帮助您直接从VS Code编辑器管理package.json文件 。 该扩展支持运行package.json文件中定义的npm脚本,并支持根据package.json中定义的依赖项验证已安装的模块。

35. REST客户端

如果您使用第三方工具和API,此简单扩展将使您更轻松地对应用程序进行故障排除。 它使您可以结束HTTP请求并直接在Visual Studio Code中查看响应

36. CSS速览

CSS偷看

顾名思义,此扩展使您可以查看css ID和类字符串,作为从html文件到相应CSS的定义

37.正则表达式预览器

Regex与VS Code中JavaScript,TypeScript,PHP和Haxe匹配预览器。 为了使这些正则表达式神秘化,它会在并排文档显示当前正则表达式的匹配项 ,您可以打开和关闭这些匹配项

38. 实时SASS编译器

活的Sass编译器

看那个萨斯! 此VS Code扩展名将帮助您实时将SASS / SCSS文件编译/转换为CSS文件 ,并通过实时浏览器预览重新加载。

39. 波兰码

如果您倾向于阅读教程和操作方法,则可能会遇到作者有时包括的完美代码屏幕截图。 这些都是使用Polacode( 您的代码的宝丽来)产生的。

40. Excel查看器

excel查看器

如果您的代码使用电子表格,则此方便的扩展名将使您可以在Visual Studio Code工作区中查看Excel电子表格和CSV文件

41. 任务浏览器

通过此扩展,您可以轻松地在VS Code中管理系统任务。 它支持npm,vscode,ant,gradle,grunt,gulp,batch,bash,make,python,perl,powershell,ruby和nsis。 它整齐地将所有任务组织在树中,并支持某些任务执行

42. 远程– SSH

Remote-SSH扩展使您可以将带有SSH服务器的任何远程计算机用作开发环境 。 只需使用SSH打开远程计算机上的任何文件夹就可以了!

如果您认为我们的广泛清单缺少扩展名,请在评论部分中添加自己的扩展名,以进行扩展。


取得Codota


From: https://blog.codota.com/top-42-free-vscode-extensions/

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值