vscode 不支持的客户端_大前端时代你的vscode插件

编者按:本文转载自知乎专栏,由作者 五溪ICEPY 授权奇舞周刊转载。

2018已成历史,大前端的时代不知不觉中已然来到了我们身边,完善你的军刀库为你的开发进行时提升效率,是我们必然要进行的事情。这一篇文章收集了一些我经常使用的 vscode 插件,它们解决了很多我遇到的问题,为我提升效率带来了很大的改进,因此分享给大家。

EditorConfig for VS Code

此插件尝试使用.editorconfig文件中的设置覆盖用户/工作区设置,不需要其他或特定于vscode的文件,与任何EditorConfig插件一样,如果未指定root = true,EditorConfig将继续在项目外部查找.editorconfig文件。

82960299a2e7e7f06188d5b7c2cec7e0.png

f0bcedef69ebbadaacfd586388467412.png

Flutter

2018是 Flutter 最火爆的一年,做为 Google 开发的军刀级的 UI 框架,不妨尝试一番,vscode 的支持需要安装这个插件。

4dfab0b59b5e51c1dfa1b1116b228938.png

a568165f2eacf2ee446dcf1a73db523b.png

7e9260e32acab28a744d7614ff9ee012.png

4ad5c456e9ae0f8c64d07dff2d340d2a.png

Debugger for Chrome

用于在Google Chrome浏览器或支持Chrome DevTools协议的其他目标中调试JavaScript代码的VS Code扩展。

d6f411e7cd88b48a1ec045499dcef4d8.png

978e63d549fa7fe7786056dd2abcb186.png

TSLint

今年 TypeScript 足足火爆了一年,Angular,Vue 都从社区的经验中推荐使用 TS 来开发你的前端项目,那么做为检查工具 TSLint 必不可少;

39b33afb8789567502af0bf14337fa34.png

d906ff0f086999995a1f56cf997e504b.png

Git Blame

在多人协作的场景下,有节奏的观察 commit 信息会是一件很有帮助的事情;

9d55b5798bd7c5ff1f946881cc9d6091.png

f39183ecd123fe39a550a9038300fc47.png

Eva Theme

一个很柔和的主题在开发进行时会得到很愉悦的体验,Eva Theme 就如此非凡;

4894fbe6049944decfd66f785f96eb8a.png

d7c2f5c3a49bdb0f1dc76c53f7293079.png

Bracket Pair Colorizer

此扩展允许使用颜色标识匹配的括号。 用户可以定义要匹配的字符以及要使用的颜色。

3457037a65eff5ad806382bc29930ffc.png

68eac4aaaa765afe5533198b8e8a4e81.png

C/C++

此扩展的版本为C / C ++添加了对Visual Studio Code的语言支持,如果你写 Node.js 很有必要安装它。

2db0920f2e5a25dbcbe3cb645aae20f9.png

45df51059ff3e082dd63a55ecae5d006.png

GitLens

GitLens 增强了 Visual Studio Code中内置的Git功能。 它可以帮助您通过Git责备注释和代码镜头一目了然地查看代码作者身份,无缝导航和探索Git存储库,通过强大的比较命令获得有价值的见解,以及更多。

5864c4f22da9ea83d61ee20821582e50.png

bfbf1c262eece669ca2be2cb4424f08a.png

VS Live Share

此外,与传统的结对编程不同,Visual Studio Live Share允许开发人员一起工作,同时保留他们的个人编辑器首选项(例如主题,键绑定),以及拥有自己的光标。这使您可以在彼此之间无缝转换,并能够自己探索想法/任务。在实践中,这种一起工作和独立工作的能力提供了一种协作体验,这种体验对于许多常见用例来说更加自然。

66d9a7daf5e6dfd19cc51e5dffd7a8d1.png

d0e20fdd8db47a26d6dff99fb8c99d1e.png

npm Intellisense

Visual Studio Code插件,用于在import语句中自动填充npm模块。

d4cd09c209a85bbecf8e4ba79fc912f1.png

390924813ef2e7380d1399155454e049.png

Beautify

格式化代码

20383e39602b7d7a14569b774b542d38.png

0097686230f822ed66012f883619cdb7.png

Apollo GraphQL

丰富的编辑器支持GraphQL客户端和服务器开发,可与Apollo平台无缝集成。

ffd92bcacf3f665d3885b3d0300f044c.png

326fa90fae42c7e665b7e58cd83f042e.png

Go

此扩展为Go代码添加了对Go语言的丰富语言支持。

5cd10fdbb4c6466137d2fa08a9a4b334.png

c1d9e8985a37880c3e6f7d221e59b3cb.png

JavaScript (ES6) code snippets

此扩展包含用于Vs代码编辑器的ES6语法中的JavaScript代码片段(支持JavaScript和TypeScript)。

b7d617d45a61a40e86d779131c30eb9c.png

React Native Tools

此扩展为React Native项目提供了一个开发环境。 使用此扩展,您可以调试代码并从命令选项板快速运行react-native命令。

85cac0a0f7cf05ad036829fe943f5304.png

12d59cceadc2fbd1b63e5aa66dada529.png

Reactjs code snippets

此扩展包含Reactjs的代码片段。

7a2e4da98da88a75bc0b1460b48768dd.png

e435e49da31e473a73298dfcc17c6e33.png

关于奇舞周刊

《奇舞周刊》是360公司专业前端团队「奇舞团」运营的前端技术社区。关注公众号后,直接发送链接到后台即可给我们投稿。

2a370da0d0b24f8dafc3badad4f0b83d.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值