V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
xitu
V2EX  ›  推广

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

  •  1
     
  •   xitu · 2016-07-07 11:50:09 +08:00 · 1936 次点击
    这是一个创建于 3060 天前的主题,其中的信息可能已经有所发展或是发生改变。

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

    1. 掘金 Chrome 插件

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

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

    Gold.png

    2. Vue.js devtools

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

    Vue devtools.jpg

    3. React Developer Tools

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

    React Devtool.gif

    4. AngularJS Batarang

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

    AJSB.png

    5. ng-inspector for AngularJS

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

    ng-inspecter.jpg

    6. EnjoyCSS

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

    EnjoyCSS.png

    7. LiveReload

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

    LiveReload.jpg

    8. jSonView

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

    jSonView.jpg

    9. User-Agent Switcher for Chrome

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

    11:30:40.jpg

    10. Page Ruler

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

    11:30:55.jpg

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

    2 条回复    2016-07-07 13:01:58 +08:00
    bdbai
        1
    bdbai  
       2016-07-07 12:59:35 +08:00 via Android
    LiveReload 用 Webpack 的 dev-server 配合 React 热加载,体验相当棒。
    crytis
        2
    crytis  
       2016-07-07 13:01:58 +08:00 via iPhone
    live reload 不错
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1163 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 20ms · UTC 18:25 · PVG 02:25 · LAX 10:25 · JFK 13:25
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.