工欲善其事，必先利其器。但我最开始接触网页的时候，人们普遍认为能用记事本写HTML和CSS的才是大神。

那时也没有前端这一说法，随着网页越来越复杂用记事本的开发效率就太低了，也就有了前端代码编辑器的出现。这一篇主要介绍几种我现在还常用到的几款编辑器。

image

但还是要说明一点，这些编辑器和IDE都只是写代码的工具而已，不一定要评个谁优谁劣，看到很多类似的争论感觉挺可笑的，就一个编辑器而言，有的人说他的优点云云，难道别的编辑器就没有吗，用的顺手，开发的效率高就是好的工具。

image

一、Dreamweaver

Dreamweaver原来是鼎鼎大名的，很长一段时间DW就是网页制作的主战场。

DW可是被称为IDE，提供了很多功能，具有所见即所得的功能。

DW有三种视图模式：代码模式、设计模式和拆分模式，拆分模式，对于代码不熟练的初学者非常友好。

image

目前DW的主要问题是老，当然如果老而弥坚是没问题的，但现在流行的前后端分离的项目，VUE，Angular,React框架，使用DW有力不从心的感觉，DW不支持ES6语法的高亮提示。不支持CSS预编译语法。

不知道DW会不会推出新的版本，如果没有，大概DW会逐渐退出前端的舞台了。

image

现在我需要他的原因有两个，

1、设计模式

比如编辑一个静态的复杂的表格，在设计模式下可以像word一样编辑表格，添加修改内容，合并拆分表格。或者使用拆分模式一边看代码，一边看效果。

另外如果拷贝黏贴一篇网上的文章到设计模式中，将会实现很好的格式化，几乎很少无意义的标签和样式，这是其他编辑器和富文本编辑器做不到的。

image

2、查找和替换功能

DW查找和替换窗口非常友好，可以在当前页面，打开的页面，当前站点，指定目录查找和替换文本，有时候非常方便。

image

二、Sublime

Sublime只是一个文本编辑器，它的拥护者也很多，非常轻量级，打开文件速度很快，

但要愉快的使用Sublime，需要安装很多插件，对于我这样的懒人，同样需要安装插件的情况下我比较愿意使用VS code。

image

三、VS Code

VS Code全称是Visual Studio Code ，它的特点有一点很值得注意，那就是免费，安装VS Code及其插件非常容易，和微软的其他Visual Studio产品比较，VS Code只是一款轻量级的代码编辑器，而不是一个重量级的完整 IDE，但在前端领域已经足够优秀。

image

四、WebStorm

WebStorm目前是我的最爱，它的功能全，集成度高，几乎想要的都有，开发效率非常高，但WebStorm的缺点是打开速度慢，占用内存多，如果你的电脑配置不好，也许用它不是一个好的选择。另外WebStorm是收费软件，这一点比不过VS Code。

image

五、 Hbuilder

Hbuilder是DCloud推出的一款支持HTML5的Web开发IDE。比上面的几种编辑器相比较，Hbuilder的用户少了一些，Hbuilder宣称自己快，也许指的是开发效率，就其打开速度和响应速度而言，我觉得可以用一个慢字形容。

Hbuilder对BootStrap和webApp的支持非常好，如果做这样的项目Hbuilder是个好选择。

image

如果你有更好的编辑器，欢迎在下方留言分享。

我是一名前端工程师，给大家推荐一个前端学习进阶内推交流群685910553(前端资料分享)有想要最新资料的小伙伴可以找我哦。希望可以在你成为程序员的路上帮到你一点。