几款好用的前端开发编辑器推荐安利

做前端开发，编辑器选得好，效率能翻倍。这些年用过的工具不少，从轻量级笔记本到重型IDE，各有各的看家本领。今天就来聊聊几款真正经受住市场考验的编辑器，它们各有侧重，但都值得你花时间了解。

一，VSCode

微软出品的这款编辑器，颜值和实力都在线。加载大文件几乎秒开，运行速度非常快。它是跨平台的，内置了对许多主流语言的支持，插件管理也极其方便——你几乎可以找到任何你需要的前端插件。最关键的是，完全免费。如果你还没试过，强烈建议上手。

二，Sublime Text!

Sublime Text 是一个文本编辑器（收费软件，可以无限期试用，但会有激活提示弹窗），同时也是一款先进的代码编辑器。由程序员Jon Skinner于2008年开发，最初被设计为具有丰富扩展功能的Vim。它体积非常小，运行速度特别快，强大的命令面板功能可以模糊匹配命令。此外，它还支持HTML和散文的先进文本编辑，拼写检查、书签、完整的Python API、Goto功能、即时项目切换、多选择、多窗口等特性一应俱全。同时支持Windows、Linux、Mac OS X等操作系统。

三，webStrom

WebStorm 是JetBrains公司旗下一款Ja vaScript开发工具，被国内前端开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的Ja vaScript IDE”。它与IntelliJ IDEA同源，继承了其强大的JS部分功能。集成了快速查找文件、快速搜索，对JS的开发全面支持，对主流语言的支持也非常到位，还集成了多版本版本控制工具。

四，Atom

Atom是GitHub专门为程序员推出的跨平台文本编辑器，支持CSS、HTML、Ja vaScript等网页编程语言，自动完成、分屏功能、集成文件管理器，常用于web开发。

五，Brackets

Brackets是一款轻巧但功能强大的现代文本编辑器，非常适合前端开发者。它最大的亮点是可以实时预览效果——你一边编辑，一边就能看到输出，非常直观。具体来说，有三个实用功能：

快速编辑：编辑HTML的CSS样式时不用再单独打开一个页签，可以直接在当前页面编辑，避免来回切换，提高效率。

实时预览：Brackets内置了一个web服务器，点击右上角闪电⚡符号，它会启动内置服务器并打开Chrome浏览器，显示工作目录下被选中的文件。

PHP支持：内置的LSP（语言服务器协议）支持为PHP、Python等语言提供了代码完成、诊断、跳转到定义等功能。

六，HBuilder

HBuilder是DCloud（数字天堂）推出的一款支持HTML5的Web开发IDE，主体由Ja va编写，基于Eclipse，因此兼容了Eclipse的插件。快，是它最大的优势——通过完整的语法提示、代码输入法、代码块等，大幅提升HTML、js、css的开发效率。秒开大文件，提供比其他工具更优秀的Vue支持，大幅提升Vue开发效率。值得一提的是，HBuilder是唯一一个新建文件默认类型是Markdown的编辑器，对Markdown的支持也是同类中最强的，你甚至可以直接粘贴表格、图片进来。一流的AST语法分析能力，语法提示精准、全面、细致，转到定义、重构等功能完善。

七，CodePen

有时候我们需要调试一些前端代码（无论是html、css还是js），或者制作一个demo分享给他人，CodePen就是这样一个在线平台。它支持即时预览，你甚至可以本地修改并即时预览别人的作品。支持多种主流预处理器，快速添加外部资源文件——只需输入库名，CodePen就会从cdnjs上寻找匹配的css或js库。免费创建模板，支持创建三个模板，不必每个作品都从白板开始。优秀的外嵌体验，在WordPress或Reddit等支持oEmbed的平台上，直接粘贴链接就能自动转为嵌入作品。

八，runJs

这是一款国内很赞的在线编辑器。RunJS是一个在线的HTML、Ja vascript、CSS等web前端代码编辑分享平台，拥有实时预览、高亮显示、代码格式化等功能。它支持OSChina、微博、QQ、Github、Google、Yahoo、Hotmail七种登录方式，你只需要有其中任意一个账号就可以立即体验。