自己的前端工具集

14

找到好的工具和插件会在这里持续更新,方便收藏的童鞋回溯。希望更多的童鞋能够把你工作上的用到的工具分享给大家!

切图类插件

作为页面仔,自己的ps没有一个好的插件怎么能行呢。

预处理器和后处理器

处理器

编译工具

编译工具中我常用到的gulp,所以都是依赖gulp插件的。如果你是使用别的自动化工具的话,可以去npm package官网上寻找你要的插件。

CSS 在线生成工具

在线的css3工具,作为学习和编写css特效项目有很大的帮助。尤其是css3动画的制作。

自动化工具

自动化工具用来安装依赖和构建项目,能够很方便的处理那些繁琐的事情如:压缩、打包、编译等。

调试工具

  • Browsersync

  • 微信调试工具

  • BrowserStack Local 一款要收费的chrome插件,提供许多许多版本的浏览器可以测试(远程开虚拟机,然后我们在浏览器里面可以看到)。还支持一些安卓和ios模拟器的查看(也有免费的可以用,不过可用的浏览器就很少了)。

  • WEB前端助手(FeHelper) 也是一款chrome的插件,功能的话可以点开链接看看。

  • Visual Event 一款用来查看页面上使用了jQuery绑定事件的元素,能够很详细的看到在哪个文件的哪一行。

  • Rosin Alloyteam 出款的一个移动端调试利器!

调试工具可以解放我们的f5键和能够更加方便的在手机上调试。大大提高生产力!

Sublime 插件

建议大家把自己的package都上传到github或者coding之类的代码托管平台,以后换电脑的时候就再也不用重新的去安装那些插件了。

其他

最后

作为一个页面仔,很需要有工具去辅助自己开发。例如:处理器、自动化工具、调试工具等。随着自己的负责的项目越来越大,更需要这些工具去处理那些繁琐的事情,让我们能够更加专注的去写代码。

如果你有更好的工具,能够有效的提高的自己的开发效率。请在评论中告知我!

你可能感兴趣的

qianjiahao · 2015年10月12日

webpack不能少~!

回复

_我已经从中二毕业了 作者 · 2015年10月12日

目前很火,可惜我还没用过。。

回复

oldfu · 2015年10月12日

很多工具还需再学习~

回复

zy0695354 · 2015年10月12日

mark~!

回复

丁一 · 2015年10月13日

前端果然很厉害

回复

piano · 2016年04月27日

不错

回复

载入中...