不凡说 / 文章详情

前端开发中值得推荐的常用工具

2020-01-10 10:57 1365

sublime

sublime
  Sublime Text 是一个代码编辑器(Sublime Text 2是收费软件,但可以无限期试用),也是HTML和散文先进的文本编辑器。Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来,它最初被设计为一个具有丰富扩展功能的Vim。
  Sublime Text具有漂亮的用户界面和强大的功能,例如代码缩略图,Python的插件,代码段等。还可自定义键绑定,菜单和工具栏。Sublime Text 的主要功能包括:拼写检查,书签,完整的 Python API , Goto 功能,即时项目切换,多选择,多窗口等等。Sublime Text 是一个跨平台的编辑器,同时支持Windows、Linux、Mac OS X等操作系统。

主要特点:

  1. 深度整合GBK编码,可以完美支持GBK编码文件。
  2. 去除自动检测升级提示。
  3. 自动换行功能。
  4. 安装EmmetZenCoding)插件。
  5. 调整字体大小为11px以适合正常人使用习惯。
  6. 软件已注册。

优点:

  • 主流前端开发编辑器
  • 体积较小,运行速度快
  • 文本功能强大
  • 支持编译功能且可在控制台看到输出
  • 内嵌python解释器支持插件开发以达到可扩展目的
  • Package Control:ST支持的大量插件可通过其进行管理

sublime官方地址:https://www.sublimetext.com/


atom

atom
  Atom 是github专门为程序员推出的一个跨平台文本编辑器。具有简洁和直观的图形用户界面,并有很多有趣的特点:支持CSS,HTML,JavaScript等网页编程语言。它支持宏,自动完成分屏功能,集成了文件管理器。

优点:

  • 小清新界面让人耳目一新.颜控必备
  • 丰富的插件几乎能够满足所有 web 开发需求
  • git 原生支持
  • 简单的插件编写
  • 自定义界面(可以更改展示和背景,ui 等等)
  • 支持各种编程语言的代码高亮(HTML / CSS / Javascript / PHP / Python / C / C++ / Objective C / Java / JSON / Perl / CoffeeScript / Go / Sass / YAML / Markdown 等等)、 与大多数其他编辑器相比,Atom的语言支持已经算是覆盖非常全面了

缺点:

  • 打开大文件比较卡
  • svn 支持较差

atom官方地址:https://atom.io/


hbuild

hbuild
  HBuilder是DCloud(数字天堂)推出的一款支持HTML5的Web开发IDE。[1] HBuilder的编写用到了Java、C、Web和Ruby。HBuilder本身主体是由Java编写。
  它基于Eclipse,所以顺其自然地兼容了Eclipse的插件。

优点:

  • 快,是HBuilder的最大优势,通过完整的语法提示和代码输入法、代码块等,大幅提升HTML、js、css的开发效率。
  • 绿柔主题,保护健康
  • 最全的语法库
  • 最全的浏览器兼容性数据
  • 强悍的转到定义和一键搜索

hbuild官方地址:http://www.dcloud.io/


webstorm

webstrom
  WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。目前已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEA同源,继承了IntelliJ IDEA强大的JS部分的功能。

优点:

  • 联想查询,项目查找函数或者变量,只需要按着Ctrl键点击函数或者变量等,就能直接跳转到定义;可以全项目查找函数或者变量,还可以查找使用并高亮。
  • 代码重构,这个操作有些像Resharper,熟悉Resharper的用户应该上手很快,支持的有重命名、提取变量/函数、内联变量/函数、移动/复制、安全删除等等。
  • 代码检查和快速修复,可以快速找到代码中的错误或者需要优化的地方,并给出修改意见,快速修复。
  • 代码调试,支持代码调试,界面和IDEA相似,非常方便。
  • 代码结构浏览,可以快速浏览和定位
  • 代码折叠,功能虽小,不过胜在方便高效
  • 包裹或者去掉外围代码,自动提示包裹或者去掉外围代码,一键搞定

webstorm官方地址:http://www.jetbrains.com/webstorm/


visual studio code

visual studio code
  Visual Studio Code(以下简称vscode)是一个轻量且强大的代码编辑器,支持Windows,OS X和Linux。内置JavaScript、TypeScript和Node.js支持,而且拥有丰富的插件生态系统,可通过安装插件来支持C++、C#、Python、PHP等其他语言。

优点:

  • 满足智能感知:使用IntelliSense提供智能完成,基于变量类型,函数定义和导入的模块,超越语法高亮和自动完成。
  • 打印语句调试已成为过去:直接从编辑器调试代码。启动或附加到正在运行的应用程序并使用中断点,调用堆栈和交互式控制台进行调试。
  • 内置的Git命令:与Git和其他SCM供应商合作从未如此简单。审阅差异,阶段文件,并从编辑器进行提交。从任何托管SCM服务推送和拉。
  • 可扩展和可定制:想要更多功能?安装扩展程序以添加新的语言,主题,调试程序,并连接到其他服务。扩展运行在不同的进程中,确保它们不会减慢你的编辑器。详细了解扩展。

visual studio code官方地址:https://code.visualstudio.com/


6.推荐一个图形工具picpick
picpick
  PicPick是一款截取全屏、活动窗口、指定区域、固定区域、手绘区域功能,支持滚动截屏,屏幕取色,支持双显示器,具备白板、屏幕标尺、直角坐标或极坐标显示与测量,具备强大的图像编辑和标注功能的软件。
  截图可以保存到剪贴板、自动或手动命名的文件(png/gif/jpg/bmp)。

软件功能

  1. 屏幕截图:支持全屏、活动窗口、滚动窗口 、窗口控制、区域、 固定区域、手绘 、重复捕捉;
  2. Ribbon界面图像编辑器: 箭头、 线条等绘图工具。模糊、 锐化、、 像素化、 旋转、 翻转,框架等特效。
  3. 拾色器和调色板:支持RGBHTML c + + Delphi等代码类型,Photoshop风格转换,保存颜色;
  4. 屏幕放大镜、量角器、屏幕坐标计算功能;为你的演示文稿把屏幕当作白板自由绘画!

优势:

  • 全面支持Windows(完全支持Windows7)
  • 多语言支持,超过28种语言
  • 所有功能都可在双显示器下使用
  • 不需要注册表、不需要系统目录,复制至USB即可运行

picpick官方地址:http://ngwin.com/picpick;


notepad++

notepad++
  Notepad++是 Windows操作系统下的一套文本编辑器(软件版权许可证: GPL),有完整的中文化接口及支持多国语言编写的功能(UTF8技术)。除了可以用来制作一般的纯文字说明文件,也十分适合编写计算机程序代码。Notepad++ 不仅有语法高亮度显示,也有语法折叠功能,并且支持宏以及扩充基本功能的外挂模组。

软件特性

  1. 所见即所得功能、语法高亮、字词自动完成功能,支持同时编辑多重文档;支持自定义语言;
  2. 对于HTML网页编程代码,可直接选择在不同的浏览器中打开查看,以方便进行调试;
  3. 自动检测文件类型,根据关键字显示节点,节点可自由折叠/打开,可显示缩进引导线,使代码富有层次感;
  4. 可打开双窗口,在分窗口中又可打开多个子窗口;
  5. 可显示选中文本的字节数,并非普通编辑器所显示的字数;提供了一些实用工具,如邻行互换位置、宏功能等;

picpick官方地址:https://notepad-plus-plus.org/;

  另外,知乎上有人推荐了一些能提高工作效率的“云端”工具:(其实就是线上工具→_→)