前端部分开发工具

前端环境软件安装

• node.js 很多东西都需要它
• npm , cnpm , spm 安装可以更换淘宝的安装包地址(淘宝镜像)
• Ruby(git依赖) , msysgit / SourceTree[win7以上]
• gulp 下面会列出常用插件 , F.I.S (百度前端工具框架)
• sass 教程/ less
• git还有另外一个工具(在xp,win7上可用还是图形的哦,还有文章) 点我

安装顺序 
先安装node --> npm --> gulp 
使用 gulp 构建工程 
先安装ruby --> git,sass,compass 
window 安装 sass compass 记录

常用工具列表：

• WebStrom 我个人比较喜欢这个软件,功能非常强大已经更新到第九版(点我下载注册机和配色方案) ,sublime_text(文章介绍),HBuilder
• cmder(类似cmd的命令提示符,有自带git版本) 配置教程
• koala考拉(Less、Sass、Compass、CoffeeScript编译) ----免费
• Mark 马克鳗 (设计图测量)
• 小苹果服务器(手机调试专用win7以上)
• F5 自动刷新浏览器
• Notepad++ 不解释
• Photoshop CS4/CS6 不解释,PS插件?建议去 设计优
• 计算器 不解释
• 右键助手1.0 (我自己开发的,详细点这里) ,彗星小助手（取色） , W3Cfuns前端开发工具箱 (到百度分享查看下载地址)
• AdobeDreamweaverCS4 写表格,热点图
• CSS Sprites 样式生成工具
• WampServer 搭建PHP环境服务器
• MyWebServer 迷你型服务器
• FlashFXP (ftp上传工具)
• Regex Match Tracer 2.1 (正则工具)
• SETUNA2 (图片裁剪对比)

火狐浏览器插件

• Firebug
• YSlow 性能检测
• JSONView 在页面查看那json数据
• CSSUsage 检测无效css
• Dust-Me Selectors 检测页面css沉余
• FireQuery jq语法高亮
• FireRainbow js语法高亮
• HtmlValidator html文档标准检测
• NoScript 控制页面和浏览器js
• FireGestures 用鼠标手势命令
• Adblock Edge 广告过滤
• webDeveloper1.2.2-(zh-cn) 中文版,点我

建议访问 360云盘共享 文件多,有点乱 

访问密码 a505

其他软件工具

• Flux 调整屏幕亮度,暖色调
• ADSafe 过滤广告
• Everything 快速查询
• Wise Registry Cleaner 注册表清理
• Clover 让你的Windows资源管理器拥有像谷歌浏览器一样好用的多标签页
• 360云盘 同步数据文件
• 有道云笔记 协作同步开发

 

其他一些网上工具

• 中国开源在线工具
• 熊猫png压缩
• 智图(多种图片压缩)
• 雪碧图坐标查询
• cssanimate动画制作工具

 

gulp常用插件

整理了在自己工作当中常用的一些gulp 插件

• 编译Sass (gulp-ruby-sass)
• 编译Map文件 (gulp-sourcemaps)
• 自动添加css前缀 （gulp-autoprefixer）
• 压缩css （gulp-minify-css）
• 压缩css使用的 gulp-mini-css[国产.配合清除沉余css插件后的压缩插件,跟上面的不一样哦]
• js代码校验 （gulp-jshint）
• 合并js文件 （gulp-concat）
• 压缩js代码 （gulp-uglify）
• 压缩图片 （gulp-imagemin）
• 自动刷新页面 （gulp-livereload）
• 图片缓存，只有图片替换了才压缩 （gulp-cache） //我也没用过
• 更改提醒 （gulp-notify） //我也没用过
• 清除文件 （del） //我也没用过
• 替换内容 （gulp-replace）

 

• 智图图片处理插件 (gulp-imageisux)

 

 

Notepad++，SublimeText3、EditPlus、EmEdit