专栏名称: 前端周刊
在前端领域跟上时代的脚步。聚焦最新前端技术、框架、教程、工具、资讯和文章,由资深前端工程师精选精编,为你传道授业解惑,在前端路上祝你一臂之力。
目录
相关文章推荐
51好读  ›  专栏  ›  前端周刊

能让你开发效率翻倍的 VSCode 插件配置(中)

前端周刊  · 公众号  · 前端  · 2018-04-14 07:55

正文

这篇文章是《能让你开发效率翻倍的 VSCode 插件配置(上)》的续篇,包括 VSCode 外观增强、功能增强、编码效率等方面的 10 个插件,其中有部分插件也是我发布上篇文章之后在评论里学到的(这可能是写技术文章的最大好处了,哈哈),试用之后觉得不错,现在也列出来(同时也感谢愿意评论交流的同学),希望对读到这篇文章的同学有所帮助。

外观增强

如果说美食需要美器的衬托,优雅美观的代码编辑器会大大提升工程师的编码体验、工作幸福感。

Guides 缩进参考

与内置的缩进参考线不同,Guides 能够让你通过配置项来修改参考线的颜色、样式、缩进空白的背景色等,如果你愿意折腾,甚至能够配置出类似 Indent Rainbow 那样风格的参考线。下图是我使用 Solarized Dark 主题时参考线的配置:

{
    "guides.normal.color.dark": "rgba(91, 91, 91, 0.6)",
    "guides.normal.color.light": "rgba(220, 220, 220, 0.7)",
    "guides.active.color.dark": "rgba(210, 110, 210, 0.6)",
    "guides.active.color.light": "rgba(200, 100, 100, 0.7)",
    "guides.active.style": "dashed",
    "guides.normal.style": "dashed",
    "guides.stack.style": "dashed",
}

实际效果图如下:

TODO Highlight

维护时间稍长的代码仓库免不了会有各种 TODO、FIXME、HACK 之类的标记,TODO Highlight 能够帮我们把这些关键词高亮出来,在你翻阅代码时非常醒目,就像是在大声提醒你尽快把他解决掉。支持自定义配置需要高亮的关键词,实际使用比较坑的地方是,TODO、FIXME 之类的后面必须加上冒号,否则无法高亮。截图如下:

功能增强

Settings Sync

Settings Sync 基于 Gist 实现 VSCode 用户配置、快捷键配置、已安装插件列表等的备份和恢复功能,配置过程有详细精确的操作步骤文档。生成的备份 Gist 默认是私密的,如果你想设置为共享的,也可以一键切换。可能你会觉得不夸机器不需要备份,以我的实际经历来看,很多悲剧都发生在没有备份的情况下,相信聪明的你你知道该怎么做了,哈哈!

Git Lens

Git Lens 把 VSCode 结合 Git 的使用体验优化到了极致,能让我们在不离开编辑器,不执行任何命令的情况下知晓光标所在位置代码的修改时间、作者信息等。官方的介绍也是非常的牛叉:

GitLens supercharges the Git capabilities built into Visual Studio Code. It helps you to visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more.







请到「今天看啥」查看全文