1. Nuclidejavascript
官網:https://nuclide.io/
Github 項目地址:facebook / nuclide(https://github.com/facebook/nuclide)
文檔:
設置:https://nuclide.io/docs/editor/setup/
Nuclide with React Native:https://nuclide.io/docs/platforms/react-native/
支持平臺:Windows、Mac、Linux
Licence:開源
特性:
內置調試
遠程開發
Developing Hack
支持 Mercurial
工做集
Nuclide 是基於 Atom 之上構建的單獨的一個包,其提供可編程性且社區很是活躍。它爲 React Native、Hack 和 Flow 項目提供一流的開發環境。php
2. Atomcss
官網:https://atom.io/
Github 項目地址:atom(https://github.com/atom)
文檔:html
設置:http://flight-manual.atom.io/
Atom with React Native:https://blog.sendbird.com/tutorial-build-a-messaging-app-using-react-native/
支持平臺:Windows、Mac、Linuxjava
Licence:開源
特性:
跨平臺編輯
內置包管理器
智能自動補全
文件系統瀏覽器
多個窗格
查找和替換
Atom 是一款現代化、易用、可控的文本編輯器。Atom 被開發人員普遍應用於多種編程語言。它有一個龐大而活躍的社區,誕生了不少有用的插件。react
Atom 經常使用的包:git
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 Textgithub
官網:https://www.sublimetext.com/
Github 項目地址:SublimeText(https://github.com/SublimeText)
文檔:
設置:https://www.sublimetext.com/docs/3/
SublimeText for React Native:https://zaicheng.me/2016/06/20/react-native-initial-setup/
爲 React-JSX 開發設置 SublimeText:(http://www.nitinh.com/2015/02/setting-sublime-text-react-jsx-development/)
支持平臺:Windows、Mac、Linux
Licence:能夠免費下載和試用,繼續使用需購買 License。
特性:
Goto Anything 功能
多個選擇
命令終端
分心自由模式
拆分編輯
即時項目開關
插件 API
可自定義任何東西
跨平臺
設置 React Native:nitinh.com/2015/02/setting-sublime-text-react-jsx-development/
Sublime Text 是一個複雜的文本編輯器,可用於編寫代碼、作標記和編寫普通文本。社區提供了大量的插件擴展其功能。Sublime Text 一直是開發人員最喜歡的編輯器。web
Sublime Text 經常使用包編程
react-native-snippets - 用於 react native 的 Sublime Text 的片斷集合
babel-sublime - 具備 React JSX 擴展的 ES6 JavaScript 的語法定義。
4. Visual Studio Code
官網:https://code.visualstudio.com/
Github 項目地址:Microsoft/vscode(https://github.com/Microsoft/vscode)
文檔:
設置:https://code.visualstudio.com/docs
使用 Visual Studio Code 開發 React Native 應用:https://blogs.msdn.microsoft.com/visualstudio/2016/02/22/develop-reactnative-apps-in-visual-studio-code/
支持平臺: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 編輯器
官網:http://www.vim.org/
Github 項目地址:vim/vim(https://github.com/vim/vim)
文檔:
Vim 文檔:http://www.vim.org/docs.php
爲 React-JSX 設置 Vim:https://jaxbot.me/articles/setting-up-vim-for-react-js-jsx-02-03-2015
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 編輯器
官網:https://www.gnu.org/software/emacs/
文檔:
官方文檔:https://www.gnu.org/software/emacs/documentation.html
針對 React Native 的初始設置:http://www.cyrusinnovation.com/initial-emacs-setup-for-reactreactnative/
License:遵循 GPL
支持平臺:Windows、Mac、Linux
特性:
內容感知編輯模式,包括語法着色,適用於多種文件類型。
完整的內置文檔,包括新手教程。
支持幾乎全部腳本語言的 Unicode 編碼。
高度可定製,使用 Emacs Lisp 代碼或圖形界面。
具備用於下載和安裝擴展的包系統。
GNU EMACS 是一個可擴展、可定製、免費、自由的文本編輯器。
擴展
web-mode.el - 它是一個自主的 emacs 主模塊,用於編輯 Web模板。它與許多語言兼容,包括 JSX(React)。
7. Spacemacs 編輯器
官網:http://spacemacs.org/
Github 項目地址:syl20bnr/spacemacs(https://github.com/syl20bnr/spacemacs)
文檔:
官方文檔:http://spacemacs.org/doc/DOCUMENTATION.html
License:開源
支持平臺:Windows、Mac、Linux
特性:
密鑰綁定使用助記符前綴進行組織
可發現 - 創新的實時顯示可用的鍵綁定。
類似的功能具備與之相同的密鑰
簡單的查詢系統能夠快速找到可用的層、包等。
社區驅動的配置提供了強大的用戶可調的包,bug 可被快速修復。
Spacemacs 是一個社區驅動的 Emacs 發行版 - 最好的編輯器既不是 Emacs 也不是Vim,它是 Emacs 和 Vim 相結合!
擴展
React layer - 適用於 React 的 ES6 和 JSX 配置層。它將自動識別 .jsx 和 .react.js 文件。一個用於 React集成的包層。
8. Deco IDE
官網:https://www.decosoftware.com/
Github 項目地址:decosoftware/deco-ide(https://github.com/decosoftware/deco-ide)
文檔:
官方文檔:https://www.decosoftware.com/docs
支持平臺:Mac(僅適用於iOS)
License:開源
特性:
組件搜索和插入
實時調整
新文件支架
Deco 是專爲 React Native 打造的 IDE。它是一個用於編寫 React Native 應用程序的一體化解決方案,無需任何環境設置便可下載和使用。Deco 專一於組件重用,並支持用戶對 UI 的實時編輯,從而改進了React Native 開發工做流程。
9. WebStorm
官網:https://www.jetbrains.com/webstorm/
文檔:
官方文檔:https://www.jetbrains.com/webstorm/documentation/
使用外部工具:https://blog.jetbrains.com/webstorm/2016/08/using-external-tools/
License:收費(單個用戶第一年需支付 129 美圓)
支持平臺:Windows、Mac、Linux
特性:
智能編碼協助
支持最新技術
版本控制系統
無縫工具集成
調試、跟蹤和測試
內置終端
WebStorm 創建在開源 IntelliJ 平臺之上,JetBrains 已經開發和完善了15多年。它提供與 VSC、本地歷史功能的緊密集成,具備充滿活力的插件生態系統,是徹底可配置的,還提供大量其餘的功能。WebStorm 爲 React 和 JSX 提供高級支持,並提供 React Native 應用程序的核心編碼協助。
10. TextMate 編輯器
官網:https://macromates.com/
文檔:
官方文檔:http://manual.macromates.com/en/
License:收費(單個用戶 License 爲48.75歐元)
支持平臺:Mac
特性:
CSS 選擇器可肯定操做和設置的範圍
快速概述和導航功能彈出
能夠把你最喜歡的腳本語言做爲插件集成
從文檔中運行 Shell 命令
代碼高亮
可與 Xcode 協做並構建 Xcode 項目
TextMate 並非 IDE,可是經過使用其強大的片斷、宏和獨特的範圍界定系統,它一般能夠提供即便是編程語言特定的 IDE 都缺少的功能。React 不直接支持,可是藉助下面的插件能夠很容易地得到對大多數 React 代碼所基於的 JSX 的支持。
插件
javascript-jsx.tmbundle - 用於JSX(React)的 Textmate Bundle。目前支持語法高亮。
總結
全部代碼編輯器都具備豐富而強大的功能。且其中的插件和擴展均可以適應 React Native 環境,所以在遷移到 React-Native 時,咱們沒必要遷移到不一樣的代碼編輯器。