转载

自己的前端工具集

切图类插件

  • cutterman

  • assistor-ps

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

预处理器和后处理器

处理器

  • Less

  • Sass

  • Stylue

  • autoprefixer

编译工具

  • gulp-autoprefixer

  • gulp-less

  • gulp-sass

  • gulp-stylus

  • gulp-sourcemaps 用来在浏览器中调试自己写的 less/sass/stylus ,能够准确在开发中工具定位。

  • koala 不想使用 gulp/grunt 等自动化工具来编译的话,可以使用这个,全平台支持。

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

CSS 在线生成工具

  • CSS小工具集合

  • CSS3 Maker

  • Border Radius

  • CSS3 Generator

  • CSS3 Tool

  • CSS3 Keyframes Animation Generator

  • Ceaser - CSS Easing Animation Tool - Matthew Lein

  • Stylie

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

自动化工具

  • npm

  • bower

  • gulp

  • grunt

  • fis3

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

调试工具

  • Browsersync

  • 微信调试工具

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

其他

  • Landscaping With Frontend Development Tools

  • Frontend Tools

  • 醉牛前端

最后

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

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

正文到此结束
Loading...