必装 6 款超神的 GitHub 插件

有太多加强 GitHub 功能的插件了，就 Chrome 商店就有上千款。本文章不会列举全部的插件，只会列举六个你们确定用的到且接地气的插件，其余花里胡哨的或者我没用过的插件就不推荐了。

图1：Chrome 商店内的相关插件

因为网络的问题，国内下载 Chrome 插件可能不太方便。老逛都帮大家下载好了，在文末获取下载方式就好了。

1. Octotree 

在开发一个项目的时候，会建立不少包使代码结构井井有条。

拿 Java 项目来讲，通常会建立 src 目录用来存放项目源码，test 目录存放一些用来测试的脚本。在 src 目录下，还会有 resource 资源和一些业务逻辑代码（好比遵循 MVC 开发模式的Controller、Service、Dao ）

其余项目亦然，咱们发现一个完整项目，代码是井井有条的，可是若是使用 GitHub 看一个项目源码时体验会很是差，查看不一样的目录操做是这样的：

图2：GitHub 目录操做

毫无疑问，这样的体验是很是糟糕的。而 Chrome 插件 Octotree 就能解决这个问题， 当你安装了这个插件，打开 GitHub 仓库时会在左边有一个按钮，点击按钮就会有这个项目的完整目录树了，体验方式和在 IDE 中差很少。

图3：目录树展现

 Chrome 插件 Octotree 有 30W + 用户，评分 5.0 。

图4：插件下载示意图

2. Sourcegraph

若是老逛推荐了一个还不错的 GitHub 项目，你想学习一下它的代码逻辑，你会怎么作 ？我猜应该是先 Download ，导入 IDE 把报错都解决了，而后 Run 起来，紧接着读它的源码。

咱们习惯使用 IDE 读源码，缘由多是大部分人都习惯使用 Ctrl + 鼠标左键 快速定位代码的功能。

可是有的人就懒得下载源码，若是直接在 GitHub 上看源码是这样的：

图5：GitHub 页面浏览源码示意图

这样看源码既没有代码层级结构，也没办法跳转定位。有没有一款插件可以解决这一痛点？

答案是有的。这个插件的名字叫 Sourcegraph。该插件在 Chrome 商店评分 4.8，100000+ 的用户，超级受欢迎，功能丰富，宛若一个功能强大的 IDE。

图6：插件下载示意图

若是本身没办法登陆谷歌商店下载，老逛也提供了其余的下载方式，老规矩文末获取。

安装插件完毕，打开 GitHub ，下图所示这个炫酷的图标就会出现，点击它你就会发现新世界。

图7：红圈为插件功能启动按钮

点击这个图标，界面会变成下图这样的。每一个区域的功能都标注了出来，我以为在浏览代码层面上能够媲美编辑器，接下来介绍三个比较经常使用的功能。

图8：插件功能界面

1. 文件树浏览

这款插件也支持文件树，并且还配备了更多更强大的功能，若是安装了这款插件彻底能够抛弃刚刚提到的 Octotree 插件。

图9 ：目录树

2. 代码定位

若是当前文件中有一个实例化的对象，咱们想查看该对象对应的类源码，在 IDEA 中，咱们能够 Ctrl + 鼠标左键进行定位，装了这个插件能够点击「Go to definition」便可跳转。

其实一个叫 OctoLinker 的插也能实现这个功能，可是装了  Sourcegraph 插件就足够了。

视频1：代码定位功能演示

3. 搜索加强

当你刚刚学习了一个技术，想找一个 Demo 学习。这时候你不须要在打开 GitHub 搜索了， 配备了这款插件的 Chrome 浏览器便可完成这一操做 ，没错，直接在浏览器搜索栏搜索代码而不是在 GitHub 平台上的搜索，同时支持持跨仓库搜索。

你只须要在浏览器的地址栏中键入 src 而后空格，便可在 Sourcegraph 上搜索查询 Demo 了。

视频2 ：搜索加强功能演示

Sourcegraph 基本能够知足咱们在浏览器端浏览源码的需求，可是还有不少需求它没法知足，好比：只想下载一个项目中的某个文件。使用 git clone 命令克隆的是整个仓库，如何轻松地获取一个仓库中的部分代码？

3. GitZip 

该插件就能帮助你轻松下载一个仓库中的部分代码，使用起来也很简单。安装插件后，找到你想下载的目录，在空白处点击鼠标右键，点击 Download 目录名 就能够下载了。

图10 ：下载部分代码演示

老逛认为装这三个插件就足够了，下面我会简单介绍几个之前用过可是最近不怎么经常使用的插件，不想往下看的朋友能够点个赞而后退出了。

Notifier for Github

该插件能够帮助显示 GitHub 未读消息数，一样也支持桌面通知，让你第一时间能够知道 GitHub 上有没有新消息。

Octohint

GitHub 只提供基本的语法高亮，你想找到某个变量须要 Ctrl + F 去找。若是是一个大的文件，这种传统查找方式比较繁琐，效率低下。

安装了 Octohint 这款插件，在使用 GitHub 浏览代码时，默认会加入参数属性提示、变量名高亮等功能，让浏览代码更加方便。

图11 ：插件功能演示

Github Hovercard

这是一款简洁的 GitHub 悬浮卡片 Chrome 插件, 可方便的查看 GitHub 上的 user/repo/issue 等信息，加强了 GitHub 的交互体验。

4. 下载方式

我把这六款插件下载了下来，本公众号「逛逛GitHub」后台输入命令「GitHub插件」就能获取下 载连接了。

安装也很简单：点击Chrome菜单  →  更多工具  →  扩展程序，进入扩展程序页面。

图12：扩展页面入口

拖拽下载好的 .crx 扩展进去就完成了安装

图13：拖拽安装插件

5. 瞎扯

好了，若是你用过其余不错的插件能够后台给我留言，我都会看。还有那个抢茅台的事情也回复一下你们，后台不少人问我有没有抢到，个人积分比较低，因此抢了两次就放弃了，若是你的小白分低于 100 就不要陪跑了。

最后，喜欢本文章的能够转发、在看。 如下平台都有老逛的身影，欢迎你们关注我在其余平台的同名帐号。

           

推荐阅读

1.  一我的居然撸了一个抖音 App

2.  IntelliJ IDEA 从入门到上瘾

3.  GitHub 暗黑模式终于来了！

天天推荐一个有趣、好玩且可能你会用到的 GitHub 项目。

△扫码关注我△

本文分享自微信公众号 - 逛逛GitHub（ggGithub）。
若有侵权，请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”，欢迎正在阅读的你也加入，一块儿分享。