如何在前端开发中增加编码效率？这里有十款Chrome扩展可以帮你

对于前端开发者来说，Chrome浏览器绝对是开发过程中不可缺少的利器：不仅仅是因为Chrome自带的功能强大的devtool，更是因为Chrome有着各种好用的前端语言调试工具以及诸如EnjoyCSS、LiveReload等这类能够提高你编码效率的强大扩展。我们就整理了十款前端开发相关的Chrome插件，在这里推荐给你。

1、掘金Chrome插件

对于开发者来说，比开发过程更重要的，应该要算平时对于开发资源以及技术文章一点一滴的积累了吧。那么，开发者能够在哪里获取需要的技术内容呢？

过去，你可能需要在GitHub、Dribbble等许多网站之间不停地跳转来寻找自己需要的内容，现在，有了掘金Chrome插件，只需要一个新标签页面，你所需要的内容，它都能够为你聚合呈现出来，绝对算得上是发现干货的利器。

2、Vue.js devtools

Chrome开发者工具扩展，用于调试Vue.js应用。

3、React Developer Tools

React Developer Tools，可以在Chrome和Firefox开发者工具审查React组件的浏览器扩展。

4、AngularJS Batarang

AngularJS Batarang是适用于Chrome的AngularJS WebInspector扩展。AngularJS Batarang是开发者工具扩展，用来调试和分析AngularJS应用。

5、ng-inspector for AngularJS

ng-inspector for AngularJS是一个在「检查元素」面板中显示当前页面实时AngularJS范围层次结构、以及它的控制器或指令与范围相关的浏览器扩展。

6、EnjoyCSS

EnjoyCSS能够通过图形化的界面帮助你在线生成CSS3代码，可谓前端开发者的一大利器。

7、LiveReload

LiveReload会监控你指定的目录中文件，如果有文件被更改，它就自动触发浏览器刷新页面，这样我们不用每次修改文件后，都要去按下F5刷新页面。

8、jSonView

很方便地帮助你验证和查看jSON文档。

9、User-Agent Switcher for Chrome

有了User-Agent Switcher for Chrome，只需要一个浏览器插件，你可以随时更换UA，测试网页的自适应情况，能够帮你很好地提高开发效率。

10、Page Ruler

Page Ruler能够帮你快速查看网页中某个具体控件或者整个网页具体尺寸的情况,测量网页元素，再也不用打开占据大片空间的「检查元素」窗口了。

不管怎么说，工具只是我们在开发过程中的辅助工具，探索好用的工具的同时，提升我们自己的开发实力才是最主要的。最后，也祝各位开发者们开发愉快！

====================================分割线================================

本文转自d1net（转载）

在半小时内从无到有开发并调试一款Chrome扩展（Chrome插件/谷歌浏览器插件） 就在不久之前，我们目前这个毕业班的班长那日同学和我说，他正在公司开发Chrome扩展，看起来很高大上的技术，实际开发却非常简单，这引起了我非常浓厚的兴趣，正所谓技不压身，检验自身技术的手段之一就是拥抱新事物，这一次我们尝试在半小时内开发一款Chrome扩展，因为之前我们做了一个[微信小程序的在线面试题题库](https://v3u.cn/a_id_116)的项目，所以正好利用这个题库将面试题平移到Chrome扩展上面。
推荐一个 Chrome 浏览历史记录管理的扩展 - History Trends Unlimited 为什么我要查找这个 Chrome 扩展呢？七月份的时候，我曾经浏览过一篇博客，当时忘记收藏了。现在12月了，我想重新找到那篇博客，但是在 Chrome 历史记录里没有找到。
Vue 创建 Chrome 掘金作者榜扩展 浏览器扩展是可以修改和增强 WEB 浏览器功能的小程序，可以用于各种各样的任务，例如屏蔽广告、管理密码、组织标签、改变网页的外观和行为等等。
chrome系列-扩展程序开发学习-做一个自己的图床 写到这里，基本上就完成了我之前一篇文章中写的，我要做一个自己的图床的小程序了。在最初我要做图床的时候，发现在谷歌扩展程序上一无所知，所以才开始学习的这个，到这一步，至少能勉强能跑通自己的小程序了。
chrome系列-扩展程序开发学习-后台运行 在程序中，会有需要后台一直运行的场景。这一节我们来做一个监控某网站的运行状态，如果没有运行，则改变当前的图标。
chrome系列-扩展程序开发学习-跨域请求数据 扩展程序中会有需要请求外部接口获取数据的时候，如果直接在JS中写的话，会跨域，但是谷歌扩展程序支持这种情况，只需要配置一下即可。