10款VS Code插件神器,超级实用

本文参考原文-http://bjbsair.com/2020-03-22/tech-info/1971.html
VS Code是这两年非常热门的一款IDE,它不仅有提升开发体验的界面、轻量化的编辑器,还有丰富而强大的插件,这些优秀的插件使得VS Code生态体系更加吸引人,让开发效率大大提升。本文来介绍5款高效的VS Code插件,总有一款能够惊艳到你。

前言

我此前写过一篇有关VS Code的文章:我最终还是选择了VS code!,没想到在公众号和知乎受到很多同学的喜欢,也被多个公众号先后转载。

看来,现在VS Code的确是一款非常热门、有强大用户基础的一款开发工具,因此,本文就来介绍5款高效、好用的插件,能够让原本单薄的VS Code如虎添翼,开发效率顿时提升到一个新的阶段。

1. CodeIf

安装次数:2万+

10款VS Code插件神器,第7款超级实用

在计算机科学中只有两件难事:缓存失效和命名。

我对这句话深有同感,当开发项目时,命名一直都是一种让我痛苦的事情。我想,应该不止我一个人有这样的感觉。

可是,命名又是开发过程中一项非常重要的事情,例如,一个好的函数命名,能够让你瞬间明白它实现的功能,这样就节省了很大一部分时间琢磨一段代码到底是什么含义。

所以,每当开发过程中遇到要命名的变量、函数、类时我就不得不停下开发,苦思冥想半天。

10款VS Code插件神器,第7款超级实用

但是,CodeIf的出现让这个问题迎刃而解,它通过搜索GitHub, Bitbucket, GitLab来找到真实的使用变量名,为你提供一些高频使用的词汇,同时为你标明使用的语言、代码链接。

可以直接在网页上搜索要命令的词汇,当然,它不仅有网页版,也支持VS Code, Atom, Sublime, WebStorm等开发工具。

在VS Code中,Extensions->搜索“CodeIf”即可完成安装。

10款VS Code插件神器,第7款超级实用

使用时只需要选中变量名,然后右键选择CodeIf就可以跳转到网页,显示候选命名。

2. local history

安装次数:14万+

修改代码之后想找回历史代码怎么办?

在使用Pycharm、IDEA时可以直接查看本地历史代码,然后轻松恢复之前某个版本。但是,VS Code默认是不支持local history的,所以,仅凭Ctrl+z撤销操作时不行的。何况,撤销操作是把前面步骤所有的操作都撤销了,其中有很多是我们不需要的。

10款VS Code插件神器,第7款超级实用

但是,为VS Code配合上local history,所有问问题就迎刃而解了。

安装这款插件之后在侧边栏会出现LOCAL HISTORY的字样,每当我们保存更改时,它都会备份一份历史文件,当我们需要恢复之前版本时,只需要点击一下对应的文件即可。此外,它还会在编辑框显示对比详情,能够让你对修改位置一目了然。

3. Partial Diff

安装次数:19万+

文件比较是一种即常用有实用的一项功能,例如,我们想查看哪里修改了代码、查看输出的日志信息有什么区别等等,如果用肉眼逐个词的去分辨,显然是无法承受的。

提起文件比较,我首先想到的就是Beyond Compare,这是一款好用的工具,但是,仅凭收费这一点就把很多人拒之门外了。

10款VS Code插件神器,第7款超级实用

还好,VS Code插件库里有Partial Diff这款神奇的插件,选中一代码,右键Select Text for Compare,选中另外一部分代码,右键Compare Text with Previous Selection即可。

4. TODO Tree

安装次数:40万+

我在此前多篇文章中提到过,习惯使用TODO、FIXME标签是一个非常好的习惯。

当我们发现某块代码需要修改,或者某块代码需要以后进一步完善,如果能够给它做一个标记,那么后续定位到对应位置是一件非常轻松高效的事情。

关于TODO标签,很多作者都推荐过TODO Highlight这款插件,但是,我更加推荐使用TODO Tree

10款VS Code插件神器,第7款超级实用

虽然很多标签工具能够实现TODO标签高亮,但问题是“我们怎么快速定位到对应的标签?”逐个的打开文件去寻找显然是很麻烦的,效率并没有得到太大的提升。

TODO Tree则不同,它不仅可以实现标签高亮,还可以在活动栏添加一个选项卡,它能够以不同视图展示我们标记的位置,单击对应标签就能够快速定位到指定位置。

5. vscode-icons

安装次数:466万+

一个好的编辑界面能够让开发过程心情舒畅,甚至可以提升开发效率。

显然,VS Code默认的图标是达不到这种程度的。

10款VS Code插件神器,第7款超级实用

但是,配合vscode-icons这款插件就不同了,它具有以下特性,

  • 自定义图标
  • 自动检测项目
  • 自定义配置

它不仅能够给文件夹、文件添加上舒适的图标,而且可以自动检测项目,根据项目不同功能配上不同图标,例如,git、Markdown、配置项、工具类等等。

6. Better Comments

安装次数:66万+

10款VS Code插件神器,第7款超级实用

是不是觉得注释信息千篇一律?

Better Comments这款插件可以让VS Code注释信息更加人性化。

它可以根据告警、查询、TODO、高亮等标记对注释进行不同的展示。此外,还可以对注释掉的代码进行样式设置。

您想要的任何其他注释样式都可以在设置中指定

7. Bracket Pair Colorizer

安装次数:250万

10款VS Code插件神器,第7款超级实用

当你看到上述示例中这样包含多层嵌套的括号时,是不是觉得很凌乱?至少,我是这样的,每当看到这样复杂嵌套括号时,尤其代码行数多起来以后,就很难确定哪些是处于同一层次的。不弄明白层次结构,当然阅读代码也会麻烦很多。

Bracket Pair Colorizer这款插件可以给()、[]、{}这些常用括号显示不同颜色,当点击对应括号时能够用线段直接链接到一起,让层次结构一目了然。除此之外,它还支持用户自定义符号。

10款VS Code插件神器,第7款超级实用

这款神器的确解决了我的痛点。

8. Better Align

安装次数:10万+

整洁的代码,是一个优秀程序员必须要做到的。当我们阅读那些大型公司开源的代码时,会发现,它的设计模式、它的编程规范都让人赞叹不已。

Better Align就是这样一款能够实现代码规范的工具,它主要用于代码的上下对齐

它能够用冒号(:)、赋值(=,+=,-=,*=,/=)和箭头(=>)对齐代码。

10款VS Code插件神器,第7款超级实用

使用方法:Ctrl+Shift+p输入“Align”确认即可。

9. change-case

安装次数:24万+

标识符和命名规则是学习一门语言最基本,也是必须要了解的一项。

不同语言对变量名、函数名、类名的命名要求不同,有的是驼峰、有的是下划线...但是,不管是什么要求,都有一个共性--命名很重要

有些编程语言甚至对命名严格到如果不按规范要求,执行时会直接报错。

change-case就是一款快速修改当前选定内容或当前单词的命名的插件。

10款VS Code插件神器,第7款超级实用

使用方法:Ctrl+Shift+p输入“change”然后选择要修改的格式即可。

10. Markdown All in One

安装次数:119万+

10款VS Code插件神器,第7款超级实用

Markdown对于开发者而言,应该是一种常用的文档书写方式,虽然我在独立Markdown文档书写时习惯于使用Typora,但是对于开发过程中涉及到的API接口文档、README,我还是习惯于使用VS Code。

Markdown All in One这款插件可以实现媲美Typora的Markdown编辑体验,它具备如下特性,

  • 丰富的快捷键
  • TOC标签
  • 数学公式
  • 自动完成
  • 列表编辑
  • 输出HTML同时转PDF
  • Github风格文档
  • ......

这款插件真正做到了All in One
本文参考原文-http://bjbsair.com/2020-03-22/tech-info/1971/
VS Code是这两年非常热门的一款IDE,它不仅有提升开发体验的界面、轻量化的编辑器,还有丰富而强大的插件,这些优秀的插件使得VS Code生态体系更加吸引人,让开发效率大大提升。本文来介绍5款高效的VS Code插件,总有一款能够惊艳到你。

前言

我此前写过一篇有关VS Code的文章:我最终还是选择了VS code!,没想到在公众号和知乎受到很多同学的喜欢,也被多个公众号先后转载。

看来,现在VS Code的确是一款非常热门、有强大用户基础的一款开发工具,因此,本文就来介绍5款高效、好用的插件,能够让原本单薄的VS Code如虎添翼,开发效率顿时提升到一个新的阶段。

1. CodeIf

安装次数:2万+

10款VS Code插件神器,第7款超级实用

在计算机科学中只有两件难事:缓存失效和命名。

我对这句话深有同感,当开发项目时,命名一直都是一种让我痛苦的事情。我想,应该不止我一个人有这样的感觉。

可是,命名又是开发过程中一项非常重要的事情,例如,一个好的函数命名,能够让你瞬间明白它实现的功能,这样就节省了很大一部分时间琢磨一段代码到底是什么含义。

所以,每当开发过程中遇到要命名的变量、函数、类时我就不得不停下开发,苦思冥想半天。

10款VS Code插件神器,第7款超级实用

但是,CodeIf的出现让这个问题迎刃而解,它通过搜索GitHub, Bitbucket, GitLab来找到真实的使用变量名,为你提供一些高频使用的词汇,同时为你标明使用的语言、代码链接。

可以直接在网页上搜索要命令的词汇,当然,它不仅有网页版,也支持VS Code, Atom, Sublime, WebStorm等开发工具。

在VS Code中,Extensions->搜索“CodeIf”即可完成安装。

10款VS Code插件神器,第7款超级实用

使用时只需要选中变量名,然后右键选择CodeIf就可以跳转到网页,显示候选命名。

2. local history

安装次数:14万+

修改代码之后想找回历史代码怎么办?

在使用Pycharm、IDEA时可以直接查看本地历史代码,然后轻松恢复之前某个版本。但是,VS Code默认是不支持local history的,所以,仅凭Ctrl+z撤销操作时不行的。何况,撤销操作是把前面步骤所有的操作都撤销了,其中有很多是我们不需要的。

10款VS Code插件神器,第7款超级实用

但是,为VS Code配合上local history,所有问问题就迎刃而解了。

安装这款插件之后在侧边栏会出现LOCAL HISTORY的字样,每当我们保存更改时,它都会备份一份历史文件,当我们需要恢复之前版本时,只需要点击一下对应的文件即可。此外,它还会在编辑框显示对比详情,能够让你对修改位置一目了然。

3. Partial Diff

安装次数:19万+

文件比较是一种即常用有实用的一项功能,例如,我们想查看哪里修改了代码、查看输出的日志信息有什么区别等等,如果用肉眼逐个词的去分辨,显然是无法承受的。

提起文件比较,我首先想到的就是Beyond Compare,这是一款好用的工具,但是,仅凭收费这一点就把很多人拒之门外了。

10款VS Code插件神器,第7款超级实用

还好,VS Code插件库里有Partial Diff这款神奇的插件,选中一代码,右键Select Text for Compare,选中另外一部分代码,右键Compare Text with Previous Selection即可。

4. TODO Tree

安装次数:40万+

我在此前多篇文章中提到过,习惯使用TODO、FIXME标签是一个非常好的习惯。

当我们发现某块代码需要修改,或者某块代码需要以后进一步完善,如果能够给它做一个标记,那么后续定位到对应位置是一件非常轻松高效的事情。

关于TODO标签,很多作者都推荐过TODO Highlight这款插件,但是,我更加推荐使用TODO Tree

10款VS Code插件神器,第7款超级实用

虽然很多标签工具能够实现TODO标签高亮,但问题是“我们怎么快速定位到对应的标签?”逐个的打开文件去寻找显然是很麻烦的,效率并没有得到太大的提升。

TODO Tree则不同,它不仅可以实现标签高亮,还可以在活动栏添加一个选项卡,它能够以不同视图展示我们标记的位置,单击对应标签就能够快速定位到指定位置。

5. vscode-icons

安装次数:466万+

一个好的编辑界面能够让开发过程心情舒畅,甚至可以提升开发效率。

显然,VS Code默认的图标是达不到这种程度的。

10款VS Code插件神器,第7款超级实用

但是,配合vscode-icons这款插件就不同了,它具有以下特性,

  • 自定义图标
  • 自动检测项目
  • 自定义配置

它不仅能够给文件夹、文件添加上舒适的图标,而且可以自动检测项目,根据项目不同功能配上不同图标,例如,git、Markdown、配置项、工具类等等。

6. Better Comments

安装次数:66万+

10款VS Code插件神器,第7款超级实用

是不是觉得注释信息千篇一律?

Better Comments这款插件可以让VS Code注释信息更加人性化。

它可以根据告警、查询、TODO、高亮等标记对注释进行不同的展示。此外,还可以对注释掉的代码进行样式设置。

您想要的任何其他注释样式都可以在设置中指定

7. Bracket Pair Colorizer

安装次数:250万

10款VS Code插件神器,第7款超级实用

当你看到上述示例中这样包含多层嵌套的括号时,是不是觉得很凌乱?至少,我是这样的,每当看到这样复杂嵌套括号时,尤其代码行数多起来以后,就很难确定哪些是处于同一层次的。不弄明白层次结构,当然阅读代码也会麻烦很多。

Bracket Pair Colorizer这款插件可以给()、[]、{}这些常用括号显示不同颜色,当点击对应括号时能够用线段直接链接到一起,让层次结构一目了然。除此之外,它还支持用户自定义符号。

10款VS Code插件神器,第7款超级实用

这款神器的确解决了我的痛点。

8. Better Align

安装次数:10万+

整洁的代码,是一个优秀程序员必须要做到的。当我们阅读那些大型公司开源的代码时,会发现,它的设计模式、它的编程规范都让人赞叹不已。

Better Align就是这样一款能够实现代码规范的工具,它主要用于代码的上下对齐

它能够用冒号(:)、赋值(=,+=,-=,*=,/=)和箭头(=>)对齐代码。

10款VS Code插件神器,第7款超级实用

使用方法:Ctrl+Shift+p输入“Align”确认即可。

9. change-case

安装次数:24万+

标识符和命名规则是学习一门语言最基本,也是必须要了解的一项。

不同语言对变量名、函数名、类名的命名要求不同,有的是驼峰、有的是下划线...但是,不管是什么要求,都有一个共性--命名很重要

有些编程语言甚至对命名严格到如果不按规范要求,执行时会直接报错。

change-case就是一款快速修改当前选定内容或当前单词的命名的插件。

10款VS Code插件神器,第7款超级实用

使用方法:Ctrl+Shift+p输入“change”然后选择要修改的格式即可。

10. Markdown All in One

安装次数:119万+

10款VS Code插件神器,第7款超级实用

Markdown对于开发者而言,应该是一种常用的文档书写方式,虽然我在独立Markdown文档书写时习惯于使用Typora,但是对于开发过程中涉及到的API接口文档、README,我还是习惯于使用VS Code。

Markdown All in One这款插件可以实现媲美Typora的Markdown编辑体验,它具备如下特性,

  • 丰富的快捷键
  • TOC标签
  • 数学公式
  • 自动完成
  • 列表编辑
  • 输出HTML同时转PDF
  • Github风格文档
  • ......

这款插件真正做到了All in One

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,530评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 86,403评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,120评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,770评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,758评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,649评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,021评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,675评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,931评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,659评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,751评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,410评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,004评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,969评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,203评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,042评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,493评论 2 343

推荐阅读更多精彩内容

  • 信息处理能力可以以两种不同的方式影响竞争力。 竞争的模式基本上可以分为两类:第一种情况下,一小部分个体可以轻易拥有...
    信息试错机阅读 301评论 0 0
  • 面试完去公司食堂吃了午饭,饭菜口味一般吧,五菜一汤自己吃多少打多少。吃完饭公司的司机师傅把我送到街上有公交车的地方...
    o蛋挞o阅读 676评论 6 12
  • 持刀者闯入教室的时候 程落正低着头在桌子上凿的洞里刷微博 突然教室里一片惊呼 她连桌子带人被撞倒在了地上 程落刚想...
    猫阿陈故阅读 161评论 0 1