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

澳门新葡萄京官网首页 1

英文:Martin Heller  译文:葡萄城控件

学习过程中遇到什么问题或者想获取学习资源的话,欢迎加入学习交流群343599877,我们一起学前端!

1.39
将查找和替换操作速度提高了一个数量级,提高了大型单行文件的加载性能,并将
Atom 升级为 Electron 3.1,具体更新内容如下:

市面上用于开发工作的编辑器非常多,笔者会经常因为不同的编程语言该如何选择好用的编辑器而感到纠结。而在随后从事
React Native
开发工作过程中,对相应的编辑器做了一些探索和研究,本文总结了一些非常适合移动应用开发的编辑器和
IDE。1. Nuclide 官网: Github 项目地址:facebook / nuclide() 文档:
设置: Nuclide with React Native: 支持平台:Windows、Mac、Linux
Licence:开源 特性: 内置调试 远程开发 Developing Hack 支持 Mercurial
工作集Nuclide 是基于 Atom
之上构建的单独的一个包,其提供可编程性且社区非常活跃。它为 React
Native、Hack 和 Flow 项目提供一流的开发环境。2. Atom 官网: Github
项目地址:atom() 文档: 设置: Atom with React Native:
支持平台:Windows、Mac、Linux Licence:开源 特性: 跨平台编辑
内置包管理器 智能自动补全 文件系统浏览器 多个窗格 查找和替换Atom
是一款现代化、易用、可控的文本编辑器。Atom
被开发人员广泛应用于多种编程语言。它有一个庞大而活跃的社区,诞生了很多有用的插件。Atom
常用的包:
atom-react-native-autocomplete package – 该包针对
React-Native,为 Atom 编辑器提供自动补全功能。 atom-react-native-css –
这是一个内置支持 SASS、SCSS 的 React-Native 组件的包。React-native-css
将有效的 CSS、SASS转换为 CSS 的 Facebook 子集。 react-native-snippets –
该包是 Atom和 Nuclide 的 React Native 片段。 zenchat-snippets –
它是react-native、redux 和 ES6 的片段集合。 atom-xcode – 用于集成 Mac
Xcode 和 atom。安装之后,iOS 模拟器可以在 atom 内进行控制。
language-babel – 包含所有 JavaScript 版本的语法,包括 ES2016 和
ESNext、用于 Facebook React 的 JSX 语法、以及 Atom 的 etch。3. Sublime
Text
官网: Github 项目地址:SublimeText() 文档: 设置: SublimeText
for React Native: 为 React-JSX 开发设置 SublimeText:()
支持平台:Windows、Mac、Linux
Licence:可以免费下载和试用,继续使用需购买 License。 特性: Goto
Anything 功能 多个选择 命令终端 分心自由模式 拆分编辑 即时项目开关 插件
API 可自定义任何东西 跨平台 设置 React
Native:nitinh.com/2015/02/setting-sublime-text-react-jsx-development/Sublime
Text
是一个复杂的文本编辑器,可用于编写代码、做标记和编写普通文本。社区提供了大量的插件扩展其功能。Sublime
Text 一直是开发人员最喜欢的编辑器。Sublime Text 常用包
react-native-snippets – 用于 react native 的 Sublime Text 的片段集合
babel-sublime – 具有 React JSX 扩展的 ES6 JavaScript 的语法定义。4.
Visual Studio Code
官网: Github 项目地址:Microsoft/vscode() 文档:
设置: 使用 Visual Studio Code 开发 React Native 应用:
支持平台:Windows、Mac、Linux 特性: 内置 Git 命令
可扩展并且可定制Visual Studio Code 是由 Microsoft 为 Windows、Linux 和
OS X 开发的源代码编辑器。它是免费和开源的,支持调试、嵌入式 Git
控件、语法高亮、智能代码补全、代码段和代码重构。扩展 ReactNative
Tools – 此扩展为React Native
项目提供了开发环境。你可以调试代码,从命令终端快速运行 react-native
命令,并使用 IntelliSense 浏览 React Native API 的对象、函数和参数。
Vim编辑器5. Vim 编辑器 官网: Github 项目地址:vim/vim() 文档: Vim
文档: 为 React-JSX 设置 Vim:[url=””][/url] License:开源
支持平台:Mac、Linux 特性: 持久、多层次的撤销树 广泛的插件系统
支持数百种编程语言和文件格式 强大的搜索和替换功能 能够与许多工具集成Vim
是一种高度可配置的文本编辑器,可以非常高效地创建和更改任何类型的文本。大多数
UNIX 系统都以 “vi” 的形式支持它。许多开发人员喜欢使用 Vim
进行各种编辑工作。Vim 非常稳定,并且在不断发展而变得更好。Vim 插件
vim-jsx – 提供 JSX 的语法高亮和缩进。 vim-react-snippets – 一组为 Vim
打造的可与Facebook 的 React 库一起使用的片段。 vim-babel – 一组为 Vim
打造的可与Facebook 的 React 库一起使用的片段。6. GNU Emacs 编辑器
官网: 文档: 官方文档: 针对 React Native 的初始设置: License:遵循
GPL 支持平台:Windows、Mac、Linux 特性:
内容感知编辑模式,包括语法着色,适用于多种文件类型。
完整的内置文档,包括新手教程。 支持几乎所有脚本语言的 Unicode 编码。
高度可定制,使用 Emacs Lisp 代码或图形界面。
具有用于下载和安装扩展的包系统。GNU EMACS
是一个可扩展、可定制、免费、自由的文本编辑器。扩展 web-mode.el –
它是一个自主的 emacs 主模块,用于编辑 Web模板。它与许多语言兼容,包括
JSX。7. Spacemacs 编辑器 官网: Github
项目地址:syl20bnr/spacemacs() 文档: 官方文档: License:开源
支持平台:Windows、Mac、Linux 特性: 密钥绑定使用助记符前缀进行组织
可发现 – 创新的实时显示可用的键绑定。 相似的功能具有与之相同的密钥
简单的查询系统可以快速找到可用的层、包等。
社区驱动的配置提供了强大的用户可调的包,bug 可被快速修复。Spacemacs
是一个社区驱动的 Emacs 发行版 – 最好的编辑器既不是 Emacs 也不是Vim,它是
Emacs 和 Vim 相结合!扩展 React layer – 适用于 React 的 ES6 和 JSX
配置层。它将自动识别 .jsx 和 .react.js 文件。一个用于
React集成的包层。8. Deco IDE 官网: Github
项目地址:decosoftware/deco-ide() 文档: 官方文档: 支持平台:Mac
License:开源 特性: 组件搜索和插入 实时调整 新文件支架Deco 是专为 React
Native 打造的 IDE。它是一个用于编写 React Native
应用程序的一体化解决方案,无需任何环境设置即可下载和使用。Deco
专注于组件重用,并支持用户对 UI 的实时编辑,从而改进了React Native
开发工作流程。9. WebStorm 官网: 文档: 官方文档: 使用外部工具:
License:收费 支持平台:Windows、Mac、Linux 特性: 智能编码协助
支持最新技术 版本控制系统 无缝工具集成 调试、跟踪和测试 内置终端WebStorm
建立在开源 IntelliJ 平台之上,JetBrains 已经开发和完善了15多年。它提供与
VSC、本地历史功能的紧密集成,具有充满活力的插件生态系统,是完全可配置的,还提供大量其他的功能。WebStorm
为 React 和 JSX 提供高级支持,并提供 React Native
应用程序的核心编码协助。10. TextMate 编辑器 官网: 文档: 官方文档:
License:收费 支持平台:Mac 特性: CSS 选择器可确定操作和设置的范围
快速概述和导航功能弹出 可以把你最喜欢的脚本语言作为插件集成 从文档中运行
Shell 命令 代码高亮 可与 Xcode 协作并构建 Xcode 项目TextMate 并不是
IDE,但是通过使用其强大的片段、宏和独特的范围界定系统,它通常可以提供即使是编程语言特定的
IDE 都缺乏的功能。React
不直接支持,但是借助下面的插件可以很容易地获得对大多数 React
代码所基于的 JSX 的支持。插件 javascript-jsx.tmbundle – 用于JSX的
Textmate
Bundle。目前支持语法高亮。总结所有代码编辑器都具有丰富而强大的功能。且其中的插件和扩展都可以适应
React Native 环境,因此在迁移到 React-Native
时,我们不必迁移到不同的代码编辑器。引用原文:Top 10 Editors For React
Native Mobile App Development作者:Murtaza Basrai翻译:安翔

对于JavaScript程序员来说,目前有很多很棒的工具可供选择。本文将会讨论10个优秀的支持JavaScript,HTML5和CSS开发,并且可以使用Markdown进行文档编写的文本编辑器。为什么使用编辑器而不是IDE进行JavaScript编程?原因就是速度快。

基于 Ripgrep 的查找和替换

在大型存储库上执行一个项目范围搜索的速度要快得多,因为有了一个新的搜索后端,这个后端就是基于
Ripgrep 的。就目前而言,Ripgrep
是一个实验性的功能,可以在查找和替换(find-and-replace)包的设置中切换。

澳门新葡萄京官网首页 2

 针对不同规模的存储库进行测试,快了 22 倍:

澳门新葡萄京官网首页 3

编辑器和IDE之间的本质区别在于:IDE不但可以调试,并且可以对代码进行概要分析,IDE还支持应用程序的生命周期管理(ALM)系统。我们在这里讨论的许多编辑器至少支持一个版本控制系统,通常是Git,现在IDE和编辑器之间的区别也越来越小。

升级到 Electron 3.1

Atom 现在运行在 Electron 3.1
上,它将我们的底层浏览器实现从
Chrome 61 推进到 Chrome
66,并允许包访问新的浏览器特性,包括对异步迭代器和生成器的本机支持。 

在这10个JavaScript编辑器中,Sublime Text和Visual Studio
Code是其中排名靠前的两个。Sublime
Text以其速度和方便的编辑功能多样性出名,Visual Studio
Code的功能和速度与Sublime
Text几乎一致。TextMate排名第三,虽然TextMate在两年前排名第一,但其功能并没有真正跟上发展。

提高了加载大型单行文件的性能

在以前,加载包含一行的多兆字节文件会导致 Atom 的性能问题。在 1.39
中,这类文件的加载速度是以前的 75 倍。

你很可能在Sublime Text,Visual Studio
Code和Brackets中找到自己喜欢的JavaScript编辑器,但是还有其它的编辑器工具Atom,BBEdit,Komodo
Edit,Notepad
++,Emacs和Vim等值得了解。你可以根据现在的项目,选择其中最为方便使用的编辑工具。

改进了在 TypeScript 中的 JSX 支持

现在 ide-typescript包支持 .tsx 文件中的 JSX 表达式。此外,现在可以在
JSX
表达式中提供类型参数,而不混淆
Atom 的语法突出显示。

除此之外,还带来了 Atom 1.40 beta, 此版本提供了更丰富的与 GitHub
拉请求的集成,提高了许多常见操作的可靠性,并继续增强了对多种编程语言的支持,主要特性包括查看
Atom 内部的 pull 请求检查状态、增强可靠性和增强语言支持等。

详细内容清查看发布说明

(文/开源中国)    

下面我们来了解所有的编辑器,文末会对它们进行对比。

Sublime Text

澳门新葡萄京官网首页 4

如果你想要一个灵活、强大、可扩展的文本编辑器,它能够如闪电般快速运行,并且支持切换到其它窗口进行代码检查、调试和部署,那么可以考虑使用Sublime
Text。

除了速度较快以外,Sublime
Text还有许多值得注意的优势,它涵盖了70多种文件类型,其中包括JavaScript、HTML和CSS; 即时导航和即时项目切换; 多选项(一次进行一系列更改),包括列选择(一次选择文件的一个矩形区域); 多窗口(使用你的所有显示器窗口)和拆分窗口; 使用简单的JSON文件进行完整的自定义; 基于Python的插件API; 一个统一的、可搜索的命令板。

对于使用其它编辑器的程序员来说,Sublime
Text支持TextMate包(不包括命令)和Vi / Vim仿真。

Sublime
Text是一个高度可配置和可扩展的文本编辑器。它包含超过50种语法,其中包括JavaScript,它可以使用Sublime软件包和TextMate语法定义进行扩展。可以能够通过少量按键来安装Babel(React)和TypeScript(Angular)的语法和支持。

Sublime
Text支持多个窗口、拆分窗口,每个项目可以有多个工作区、多个视图以及包含视图的多个窗格。当想要整合、调试和测试空间时,使用所有的屏幕空间会变得相当简单的。Sublime
Text还支持所有内容的自定义:颜色,文本字体,全局键绑定,制表符停止,特定文件的键绑定和代码段,甚至语法突出显示规则等。Sublime
Text的编码文件默认为JSON文件,语言定义默认是XML。

Sublime Text有一个活跃的用于创建和维护Sublime
Text包和插件的社区。Sublime
Text缺少的许多功能,包括JSLint和JSHint接口,JsFormat,JsMinify,PrettyJSON和Git支持
,都可以通过社区使用Package Installer来实现。

官网链接:

下载地址:
**

Visual Studio Code

澳门新葡萄京官网首页 5

Visual Studio
Code是一个的免费的轻量级编辑器和IDE,它是Microsoft发布的。它具有Visual
Studio组件,能与开源的Atom Electron
shell混合使用。它对于使用C#进行ASP.Net
Core的开发,提供了极好的支持;同时它也通过TypeScript和JavaScript为Node.js的开发,提供了极好的支持。不同于Visual
Studio仅在Windows上支持的惯例,Visual Studio
Code也能在MacOS和Linux上运行。

由于包含了TypeScript编译器和Salsa引擎,Visual Studio
Code具有非常好的JavaScript代码完成功能。Visual Studio
Code会将JavaScript代码发送到后台的TypeScript编译器来推断类型并构建符号表。你可以在屏幕图像底部的框中看到hasOwnProperty方法的信息。

相同的符号表使得IntelliSense能够在整个表达式的输入过程中,为你提供出色的弹出式选项列表。你可以获得以下功能:填入后自动关闭、自动填写完成选项、键入后的自动方法列表和方法中的自动参数列表。你可以通过从DefinitelyTyped添加对d.ts文件的引用,来增强IntelliSense。当你识别常见问题(例如使用Node.js内置变量中的__dirname)时,Visual
Studio Code将为你提供这些功能。

Visual Studio
Code是一个免费的轻量级编辑器和IDE,用于Node.js和ASP.Net 开发。它结合了Microsoft技术,例如TypeScript编译器、Roslyn
.Net编译器和Atom使用的Electron shell。Visual Studio
Code适用于Windows,MacOS和Linux平台。

Visual Studio Code的Git支持非常好,使用起来很简单。Visual Studio
Code调试器为Node.js和ASP.Net开发提供了出色的调试体验。Visual Studio
Code具有非常好的HTML,CSS,Less,Sass和JSON工具,这个工具是基于与Internet
Explorer F12开发人员工具相同的技术。此外,Visual Studio
Code可以与外部任务运行程序(如gulp和jake)进行可定制的集成。

Visual Studio
Code有着强大的插件生态系统,例如支持Angular和React。推荐可以在使用JavaScript和TypeScript框架和库构建应用程序时使用Visual
Studio Code。

官网链接:

下载地址:

Brackets

澳门新葡萄京官网首页 6

Brackets是一个免费的开源编辑器,最初来自于Adobe,旨在为JavaScript,HTML和CSS提供更好的工具以及相关的开放式Web技术。Brackets本身是用JavaScript,HTML和CSS编写的。除了内置功能外,Brackets还有一个扩展管理器,用于扩展前端开发人员使用的许多语言和工具。Brackets不像Sublime
Text和TextMate那样运行的很快,但除了从网络加载或更新程序内容的暂停之外,它仍然运行的非常快。

Brackets不仅对JavaScript,CSS,HTML和Node.js有着很好的支持,它还具有一些其它很棒的功能,例如与HTML
ID相关的CSS在线编辑。此外,Brackets有着一个简洁的UI界面和编辑时网页的实时预览。对于免费的代码编辑器来说,Brackets是一个很好的选择。

Brackets扩展也是用JavaScript编写的,还可以调用Node.js模块。与大多数在选项卡中显示打开文件的编辑器不同的是,Brackets具有显示在文件树上方的工作文件列表。

Brackets的JavaScript自动完成功能非常好,自动填写各类括号的结束括号,以及jQuery方法中键入$之后的关键字、变量和方法的自动下拉菜单。Brackets可以控制Node.js的调试器,并从菜单项中重新启动Node。Brackets可以很方便的添加附加功能的扩展(例如TypeScript和JSX支持,Bower集成和Git集成)。

快速编辑、快速保存文档、快速打开文件和实时预览均有助于简化Web应用程序编辑,让你专注于编码或设计。Brackets也有一些缺点,例如一些Brackets扩展很难配置,不像Emacs软件包或Vim插件那样容易。

官网链接:

下载地址:

Atom

澳门新葡萄京官网首页 7

Atom
1.15.0是一款GitHub上的免费的开放源代码、可编程的编辑器,适用于Windows,MacOS和Linux平台,它与GitHub应用程序集成在一起,拥有很多个可用的软件包和主题。

Atom源代码位于GitHub上,它是用CoffeeScript编写的,与Node.js集成在一起。Atom是Chromium浏览器的一个特殊的存在,它被设计成一个文本编辑器而不是一个Web浏览器; 每个Atom窗口本质上都是一个本地呈现的网页。

当Atom不自动更新时,性能是非常好的。它具有一些非常棒的功能,例如模糊搜索、快速项目搜索和替换、多个光标和选择、多个窗格、代码段、代码折叠以及导入TextMate语法和主题的功能。Atom可以安装两个命令行实用程序:Atom,用于从shell启动编辑器;APM,用于管理Atom的软件包。

官网链接:

下载地址:

Komodo Edit

澳门新葡萄京官网首页 8

Komodo Edit 是ActiveState的一个免费的,缩小功能版本的Komodo
IDE,它是一个很酷的多语言编辑器。

如果你喜欢Komodo IDE但是却支付不起,那么Komodo
Edit会是你的一个好选择。Komodo
Edit不是一个IDE,所以你需要在编辑器外完成代码控制。

它不提供实时代码收集功能,如果你独立开发,不与其他人合代码,就没有任何问题。它也不提供HTTP检查器。Komodo
Edit具有与Komodo
IDE相同的编辑功能,但缺少代码重构、调试、单元测试、源代码控制集成以及其他适合于IDE的功能。

在任何情况下,Komodo
Edit可以免费满足你的JavaScript编辑需求,并为编辑HTML,CSS,Python,Perl,Ruby,Tcl和其它编程提供标记语言。

官网链接:

下载地址:

Notepad ++

澳门新葡萄京官网首页 9

Notepad
++是一个免费的开源Windows源代码编辑器和记事本,非常适合于编辑JavaScript。它支持约50种编程和标记语言。除了其多个文档编辑窗口之外,它还具有工作区树视图、功能列表选项卡和文档映射选项卡。它的加载时间足够快,性能足够强,不会让你感到速度慢。

使用语法着色和折叠功能、可编辑功能(包括列模式编辑和正则表达式、支持搜索和替换)以及一定量的功能完成和参数提示功能,Notepad++可以轻松地成为JavaScript的首选代码编辑器。然而,它还不是全面的JavaScript编辑器,它还不能生成代码,执行诸如重构的操作,并在大型项目中快速导航。

官网链接:

下载地址:

BBEdit

澳门新葡萄京官网首页 10

BBEdit
11.0.3是一个文本编辑器,仅用于Mac的HTML,它支持约35种编程和标记语言,社区版还通过BBEdit网站提供了对许多其它语言的支持。许可版和社区版都有语法高亮;许可版还有一定量的自动完成功能,主要用于功能名称、变量名称、少量的关键字和标签。许可版还能与Git,Perforce和Subversion版本控制系统集成。

BBEdit
11是该产品的重大改写,这个版本比以前更加快速,并且还能够很好地处理Ginormous文件。它具有将选择或查找结果复制到新缓冲区中的提取功能,以及剪切功能。BBEdit可以编辑和运行Perl,Python,Ruby,和Shell脚本,以及检查Perl和Python脚本的语法。

BBEdit对HTML和Markdown的支持实际上比其对JavaScript支持更好。你可以为BBEdit安装三个命令行工具:一个用于编辑器,一个用于差异引擎,最后一个用于多媒体搜索。

官网链接:

下载地址:

TextMate

澳门新葡萄京官网首页 11

TextMate曾经主要用于在MacBook上编写Ruby on
Rails,但是现在TextMate变得不那么突出了,与此同时Sublime
Text逐渐收到了欢迎。

TextMate不是一个IDE,但是它却提供了软件包、代码段、宏和范围系统等语言特定的IDE都缺少的功能。TextMate现在提供了简单的JavaScript和jQuery的捆绑包,它们为快速生成JavaScript和jQuery代码提供了一系列不错的工具。要想具有类似于IDE的功能,你可以使用TextMate的shell集成版本,但不要期待TextMate可以进行代码重构、自动单元或回归测试。如果正确设置了Grunt,那么TextMate就可以自动执行JavaScript测试。

TextMate有一个捆绑包首选项标签,从中可以下载并安装其他捆绑包。捆绑源,实际上是产品驻留在GitHub存储库中的源代码。

官网链接:

下载地址:

Emacs

澳门新葡萄京官网首页 12

Emacs及其衍生来自于自20世纪70年代初以来的MIT
AI实验室。Emacs从作为TECO文本编辑器的宏开始,逐步发展独立。默认安装在MacOS上的Emacs是22.1.1版本,没有GUI支持。你可以轻松地安装XEmacs,Aquamacs(MacOS的GUI)和更新的GNU
Emacs版本。Emacs作为JavaScript编辑器,编辑JavaScript的默认模式是在js包中,使用Emacs可以获得更好的语法高亮和linting。

Emacs使用js2模式包,并使用ac-js2自动完成。在Emacs中,你可以使用串行模式获取实时浏览器JavaScript,HTML和CSS交互。

官网链接:

下载地址:

Vim(and variants)

澳门新葡萄京官网首页 13

Vi(visual interface)最初由Bill
Joy为Unix撰写,自1976年开始,逐渐由Ed向Ex演变。Vim是一个免费的、开源的、改进版的Vi;默认安装在Mac
OS X上的是7.3版本。

你可以轻松安装Vim的更新版本,MacVim(MacOS的GUI)或任何适用于你的平台的功能。Vim作为JavaScript编辑器,它的vim-plug
readme文件中的建议是相当好的。

官网链接:

下载地址:

使用哪个编辑器,由你决定

无论你是专注于客户端的JavaScript还是Node.js,都有多种选择。

如果你正在寻找一个功能强大,速度很快的JavaScript编程文本编辑器,并支持很多其它语言,可以选择Sublime
Text。

如果你想要一个免费的,快速的JavaScript编辑器,兼容IDE,并且对ASP.Net和C#支持得很好,Visual
Studio Code是一个很好的选择。

Brackets和Atom是两个新的、免费的文本编辑器。Brackets是一款很接近于用于Node.js开发IDE的编辑器,Atom可以与GitHub桌面客户高度集成。

在Windows上,Notepad++是快速、有效并且免费的。在MacOS上,BBEdit是快速、很酷的、免费的限量版本,可用于版本控制集成,是一个HTML工具。TextMate仍然是一个非常棒的编辑器,具有快速、全功能、可扩展的特点,但是开发速度已经很缓慢。

如果倾向于使用开源脚本语言,Komodo
Edit是个不错的选择。如果喜欢自定义编辑器,Emacs或Vim可以满足你的要求。