加入收藏 | 设为首页 | 会员中心 | 我要投稿 源码网 (https://www.900php.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 移动互联 > 评测 > 正文

JavaScript开发者的27个神奇VSCode工具

发布时间:2019-08-08 04:07:43 所属栏目:评测 来源:读芯术
导读:副标题#e# Visual Studio Code(也被称为VSCode,https://code.visualstudio.com/)是一款功能强大的轻量级跨平台桌面源代码编辑器。由于其内置开发工具支持TypeScript和Chrome开发者工具,这款编辑器让人越用越喜欢。 每个人都能使用和修改的无限扩展的开

借助优化注释工具(https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments)可以把注释变成显目的彩色。

福利!JavaScript开发者的27个神奇VSCode工具

这样就可以轻松地通过添加!或者?来提醒组员需要注意的地方了。

3. 括号配对着色

第一次见到括号配对着色(https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer)的截图时,笔者就决定要将其加入开发工具箱中。

对于酷爱编程的人来说,这个扩展无疑能让编程变得更加有趣。

福利!JavaScript开发者的27个神奇VSCode工具

4. Material Theme

Material Theme(https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme)是一款能直接安装到VSCode的悠久主题,它能让代码变成下面这样:

福利!JavaScript开发者的27个神奇VSCode工具

这是目前为止最棒的主题了,赶快安装吧!

5. @typescript-eslint/parser

TypeScript用户可能已经开始由TSLint配置转向ESLint + TypeScript配置了,因为今年,TSLint背后团队宣布将弱化对其的支持。

因此现在越来越多的项目采用@typescript-eslint/parser及相关的软件包,以保证项目设置不会过时。

在Prettier网站上,依然可以用最新的设置体验ESLint的规则和兼容性。

6. Stylelint

对于所有项目来说,Stylelint(https://marketplace.visualstudio.com/items?itemName=shinnn.stylelint)都是必备的,原因有以下几个:

· 它能避免出错。

· 它能执行CSS的代码风格规范。

· 它能与Prettier配合使用。

· 它能支持CSS/ SCSS/Sass/Less。

· 它能支持社区创建的插件。

7. Markdownlint + docsify

有些人可能有这样的习惯:在开项目讨论会时,用Markdown(https://daringfireball.net/projects/markdown/)格式记笔记。

这样的笔记易于理解,而且有很多便利的Markdown文档工具,其中就包括markdownlint。

Markdownlint是一款VSCode扩展,它不但能帮助检查.md文件的书写规范,而且支持Prettier格式!

笔者在所有项目中都应用了docsify,因为它支持Markdown和其他强化。

8. TODO高亮

如果有把待办项记录在应用代码中的习惯,TODO高亮这样的扩展就会非常有用,因为它能够把整个项目中的TODO都设置为高亮。

9. Import Cost

第一次尝试的时候,你可能会觉得Import Cost非常有用。但是用了一会你可能就不再需要它了,因为它告诉你的你都已经知道了。尽管如此,还是建议你尝试一下,因为你可能会需要它。

10. Highlight Matching Tag

找不到标签的另一端时,Highlight Matching Tag就能派上用场了:

福利!JavaScript开发者的27个神奇VSCode工具

11. vscode-spotify

有些人会觉得切换到音乐软件切歌,然后回到VSCode界面继续工作有些麻烦。

Vscode-spotify就能解决这个麻烦,因为它能让程序员在VSCode里使用Spotify(Spotify是瑞典的在线流媒体音乐播放平台,民间译名“声田”或者“声破天”)!

有了这个扩展就可以在状态栏看到正在播放的歌曲,通过热键切换歌曲,点击按键控制Spotify,等等。

12. 用于VSCode的GraphQL

随着GraphQL逐步发展,几乎每个JavaScript社区都能看到它的身影。鉴于此,考虑安装用于VSCode的GraphQL也许是个不错的主意。

通过这个工具,就可以在处理GraphQL语法时使用语法高亮、linting以及自动完成等功能。

因为笔者经常使用Gatsby,所以日常编程中常常涉及到GraphQL语法。

13. 彩虹缩进

跟上文中使用括号配对着色的理由类似。如果很难找到对应的缩进,使用彩虹缩进就能让缩进更有可读性。

请看这个例子:

福利!JavaScript开发者的27个神奇VSCode工具

14. Color Highlight

这是一个到哪都会被问链接的扩展。简单来说,Color Highlight会这样给代码中的颜色标注高亮:

福利!JavaScript开发者的27个神奇VSCode工具

15. 拾色器

拾色器是一款图形用户界面的VSCode扩展,它帮助用户选择并生成颜色代码,比如说CSS颜色值。

16. REST Client

第一次尝试REST Client时,笔者并不认为这个工具会比著名的Postman软件更好用。

随着使用的深入,笔者逐渐意识到REST Client扩展给开发工具带来的巨大影响,尤其是在测试API时。

(编辑:源码网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读