个人前端工程师开发工具记录
原文地址:https://www.zybuluo.com/yyman001/note/58799
个人前端工程师开发工具记录
我们前端,每个人都有自己的开发工作环境,工具等,所以我写了这一篇文章,为自己方便把自己常用的前端工具
记录下来,以便到时候在新的电脑上可以快速搭建自己熟悉的工作环境和使用自己熟悉的工具,同时可能也会对你有少少的帮助吧!
前端环境软件安装
- 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) 中文版,点我
除了最后一个网上可能找不到中文版
谷歌浏览器插件 --用到谷歌插件其实很少
- 谷歌加速插件 替换一些需要FQ才能链接的js替换为国内链接
- JetBrains IDE Suport (配合WS 在浏览器同步刷新,似乎在谷歌高版本已经无效)
建议访问 360云盘共享 文件多,有点乱
访问密码 a505
其他软件工具
- Flux 调整屏幕亮度,暖色调
- ADSafe 过滤广告
- Everything 快速查询
- Wise Registry Cleaner 注册表清理
- Clover 让你的Windows资源管理器拥有像谷歌浏览器一样好用的多标签页
- 360云盘 同步数据文件
- 有道云笔记 协作同步开发
其他一些网上工具
- 中国开源在线工具
- 熊猫png压缩
- 智图(多种图片压缩)
- 雪碧图坐标查询
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)
再一次感谢您花费时间阅读这篇文章,如果你有更好的工具,可以给我留言,其他资料还在整理当中,感谢你的阅读!
作者 @黑色技术
2015 年 3月 15日
转载于:https://www.cnblogs.com/yyman001/p/4340161.html
个人前端工程师开发工具记录相关推荐
- 前端工程师开发工具记录
我们前端,每个人都有自己的开发工作环境,工具等,所以我写了这一篇文章,为自己方便把自己常用的前端工具记录下来,以便到时候在新的电脑上可以快速搭建自己熟悉的工作环境和使用自己熟悉的工具,同时可能也会对你 ...
- Web前端工程师开发规范必须要注意的事
Web前端工程师开发规范必须要注意的事 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范 ...
- 三十二、VsCode前端的开发工具介绍和使用
@Author:Runsen @Date:2020/6/11 人生最重要的不是所站的位置,而是内心所朝的方向.只要我在每篇博文中写得自己体会,修炼身心:在每天的不断重复学习中,耐住寂寞,练就真功,不畏 ...
- Vue 2 中,使用Vite作为前端构建开发工具,替代webpack(一)——vite.config.js配置文件
Vue 2 中,使用Vite作为前端构建开发工具,替代webpack(一)--vite.config.js配置文件 当前版本 vite@2.3.7和vite@2.4.4 "vite" ...
- 2018年20种最佳前端Web开发工具
有许多前端开发工具可以加速Web开发.以下是包含主要功能和下载链接的顶级工具的精选列表. 1)Npm: Npm是JavaScript的Node包管理器.它有助于发现可重用代码的包并以强大的新方式组装它 ...
- 2019年20种程序员必备前端Web开发工具
许多前端开发工具可以加速Web开发.以下是包含主要功能和下载链接的顶级工具的精选列表. 1)Npm: Npm是JavaScript的Node包管理器.它有助于发现可重用代码的包并以强大的新方式组装它们 ...
- 2020 前端必看 20个最好的 前端 Web开发工具
引言 市面上有许多前端开发工具可以加速 Web 开发工作.本文是对一些顶级 Web 开发工具的一次精选汇总,分别介绍了每款工具的关键特性,并已附上下载链接. 1. Novi Builder Novi ...
- 新浪前端工程师开发出在线演示文档JS框架webSlide,比impress更流畅、更实用
相信各位一直关注我们的朋友对在线演示工具不会再陌生,我们先后介绍过Prezi这个可供普通用户使用的站点,以及 impress.js这个可供开发者或是有前端设计基础的用户使用的 JS 框架.使用它们都可 ...
- html5网页制作代码_好程序员HTML5大前端常用开发工具大集合
好程序员HTML5大前端分享常用开发工具大集合HTML5作为当前最为流行的编程语言,广为适用.语言的使用人数急剧增长,更多地开发人员使用这种语言来创建各种内容并放到互联网上.随着每一个新版本的发布,H ...
最新文章
- Assets.car 桌面解压工具
- SpringBoot项目优化和Jvm调优及VisualVM远程连接监控JVM(JMX连接)
- boost::geometry::dot_product用法的测试程序
- Vue 2017 现状与展望 | 视频+PPT+速记快速回顾
- leetcode 45. 跳跃游戏 II 思考分析
- vCenter 升级错误 VCSServiceManager 1603
- 卸载源码安装mysql_CentOS7下源码安装MySQL5.7.6+
- mysql回滚部分记录_MySQL事务部分回滚-回滚到指定保存点
- Python在数字前方补0
- android Json解析详解(详细代码)
- Matlab-中寻找峰值函数,波峰波谷
- 单向链表相关——链表中环的问题
- Huffman树概念及理解
- 在Windows上安装jupyter notebook的scala kernel —— jupyter-scala
- 东软c语言课后习题,C语言笔试题及参考答案-东软集团
- 组合数递推的计算方法 c语言,组合数公式的递推公式
- 2020科目一考试口诀_2020驾考技巧科目一考试口诀答题法
- 《火车运煤问题》分析
- 推荐几款可以直接在手机上编程的app(包含Java、C、Python等)
- 怎么看网站是否被黑防止网站被黑