推荐几款前端编辑器(还在因为只知道一个编辑器被同事嘲笑吗?看完给他上一课!!!)

Posted cvvvvvvvvvv

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了推荐几款前端编辑器(还在因为只知道一个编辑器被同事嘲笑吗?看完给他上一课!!!)相关的知识,希望对你有一定的参考价值。

一,VSCode

微软出厂的高颜值编辑器
VSCode官网

1.加载大文件几乎秒开,运行速度很快
2.跨平台的文本编辑器,内置了对许多主流语言的支持
3.非常方便的管理插件,可以快速找到适合自己的前端插件
4.完全免费(非常推荐)

二,Sublime Text!


Sublime Text 是一个文本编辑器(收费软件,可以无限期试用,但是会有激活提示弹窗),同时也是一个先进的代码编辑器。Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来,它最初被设计为一个具有丰富扩展功能的Vim。
Sublime Text!官网

  1. 是款比较主流的前端编辑器
  2. 体积非常小,运行速度特别快
  3. 非常强大的命令面板功能,可以模糊匹配命令
  4. html和散文先进的文本编辑器。Sublime Text 3漂亮的用户界面和强大的功能,例如:拼写检查,书签,完整的 Python API , Goto 功能,即时项目切换,多选择,多窗口等等。同时支持Windows、Linux、Mac OS X等操作系统。。

三,webStrom


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

  1. 集成了许多强大的功能
  2. 快速查找文件,快速搜索
  3. 对js的开发全面支持,对主流行语言的支持
  4. 集成了多版本版本控制工具

四,Atom


Atom中文网

  1. github专门为程序员推出的一个跨平台文本编辑器
  2. 支持CSS,HTML,javascript等网页编程语言
  3. 自动完成分屏功能,集成了文件管理器。
  4. 常用于web 开发

五,Brackets

Brackets是一款轻巧但功能强大的现代文本编辑器。Brackets 非常适合前端人员使用,该编辑器可以实时预览效果,让你一边编辑一边查看输出效果,非常直观。
Brackets官网

  1. 快速编辑
    在你编辑HTML的CSS样式时不用再单独打开一个页签编辑CSS,可以直接编辑,避免页签之间的来回切换,提高了编辑效率
  2. 实时预览
    Brackets中内置了一个webserver,点击右上角闪电⚡符号,brackets会启动内置服务器,并启动chrome浏览器打开工作目录下被选中的文件。
    ![在这里插入图片描述](https://img-blog.csdnimg.cn/e824ec75f08344f9b1425bfd77e533be.png
  3. PHP支持
    Brackets中的内置LSP( 语言服务器协议)支持为许多开发人员开放了对php,Python等语言的支持。并启用诸如代码完成,诊断,跳转到定义等功能。

六,HBuilder

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

  1. 快,是HBuilder的最大优势,通过完整的语法提示和代码输入法、代码块等,大幅提升HTML、js、css的开发效率。
  2. 秒开大文件
  3. 提供比其他工具更优秀的vue支持大幅提升你的vue开发效率
  4. HX是唯一一个新建文件默认类型是markdown的编辑器,也是对md支持最强的编辑器,你甚至可以直接粘贴表格、图片进来。
  5. 一流的ast语法分析能力语法提示精准、全面、细致,转到定义、重构完善

七,CodePen

有时我们需要调试一些前端代码(无论是 html、css,还是 js),或者要制作一个 demo 分享给他人。这些都可以借助 CodePen 这个网站来实现。
CodePen官网

  1. 即时预览。我们甚至可以本地修改并即时预览别人的作品。支持多种主流预处理器。
  2. 快速添加外部资源文件。只需在输入框里输入库名, CodePen 就会从 cdnjs 上寻找匹配的 css 或 js 库。
  3. 免费创建模板。支持创建三个模板,不是每个作品都需要从白板开始。
  4. 优秀的外嵌体验。在 WordPress 或 Reddit 等支持 oEmbed 的平台上,只要简单地把链接贴入编辑框,发布后会自动转为嵌入作品。

八,runJs

这是国内一个很赞的在线编辑器
runJs官网

RunJS 是一个在线的 HTML、Javascript、CSS 等 web 前端代码的编辑分享平台,拥有实时预览、高亮显示、代码格式化等功能,我们提供 OSChina、微博、qq、github、google、yahoo、hotmail这七种登录方式,你只需要有七种任意一个帐号就可以点击右上角的登 录按钮来立即体验RunJS。

以上是关于推荐几款前端编辑器(还在因为只知道一个编辑器被同事嘲笑吗?看完给他上一课!!!)的主要内容,如果未能解决你的问题,请参考以下文章

几款提升开发体验的VSCode插件推荐

几款提升开发体验的VSCode插件推荐

推荐几款好用的文本编辑器

有哪些好用的代码编辑器值得推荐?

几款常用的编辑器介绍,给刚入门学Web前端的人

Visual Studio 实用扩展推荐   Visual Studio 拥有非常不错的可扩展性,在之前的文章中,我也给大家示范了如何进行编辑器的扩展(详见文末参考资源)。在本篇文章中,我将介绍几款