寫react用什麼編輯器

寫入react可以用多種編輯器，如：1、Atom，一個跨平台文字編輯器；2、Visual Studio Code，一個跨平台原始碼編輯器；3、WebStorm編輯器；4、 Sublime Text；5、Vim，一種高度可設定的文字編輯器等等。

本教學操作環境：windows7系統、React17版，DELL G3電腦，此方法適用於所有品牌電腦。

推薦：《react影片教學》

#Atom

Atom 是專門為程式設計師推出的跨平台文字編輯器，是一款現代化、易用、可控制的文字編輯器。 Atom 被開發人員廣泛應用於多種程式語言。它有一個龐大而活躍的社區，誕生了許多有用的插件。

官網：https://atom.io/

特性：

跨平台編輯

內建套件管理器

智能自動補全

檔案系統瀏覽器

多個窗格

尋找與取代

Visual Studio Code

#Visual Studio Code 是由Microsoft 為Windows、Linux 和OS X 開發的，針對於編寫現代Web 和雲端應用的跨平台原始碼編輯器。 。它是免費且開源的，支援調試、嵌入式 Git 控制項、語法高亮、智慧程式碼補全、程式碼片段和程式碼重構。

官網：https://code.visualstudio.com/

特性：

內建Git 指令

可擴充且可自訂

安裝相應插件

必要：ESLint、DocumentThis、EasyLess、Complete JSDoc Tags、vscode-flow-ide、React native Tools、vscode-wechat、npm、babel-javascript、debugger for chrome、git lens、 node debug 2、

可選：javascript (ES6) code snippets、reactjs code snippets、react-native/react/redux snippets for es6/es7、highlight bad chars、color highlight、Pathlisense、partial diff

WebStorm

WebStorm 建立在開源IntelliJ 平台之上，JetBrains 已經開發和完善了15多年。它提供與 VSC、本地歷史功能的緊密整合，具有充滿活力的插件生態系統，是完全可配置的，還提供大量其他的功能。 WebStorm 為 React 和 JSX 提供高級支持，並提供 React Native 應用程式的核心編碼協助。

官網：https://www.jetbrains.com/webstorm/

#特性：

智慧編碼協助

##支持最新技術

版本控制系統

無縫工具整合

調試、追蹤和測試

內建終端

Sublime Text

Sublime Text 是一個文字編輯器（收費軟體，可以無限期試用，但會有啟動提示彈窗），同時也是一個先進的程式碼編輯器。 Sublime Text是由程式設計師Jon Skinner於2008年1月所開發出來，它最初被設計為一個具有豐富擴展功能的Vim。

Sublime Text具有漂亮的使用者介面和強大的功能，例如程式碼縮圖，Python的插件，程式碼片段等。也可自訂鍵綁定，選單和工具列。 Sublime Text 的主要功能包括：拼字檢查，書籤，完整的 Python API ， Goto 功能，即時專案切換，多選擇，多視窗等等。 Sublime Text 是一個跨平台的編輯器，同時支援Windows、Linux、Mac OS X等作業系統。

官網：https://www.sublimetext.com/

特性：

Goto Anything 功能

多重選擇

命令終端機

分心自由模式

分割編輯

即時專案開關

外掛程式API

可自訂任何東西

跨平台

Sublime Text 常用套件

babel-sublime - 具有React JSX 擴充功能的ES6 JavaScript 的語法定義。

react-native-snippets - 用於react native 的Sublime Text 的片段集合

Vim 編輯器

Vim 是一種高度可配置的文字編輯器，可以非常有效率地建立和更改任何類型的文字。大多數 UNIX 系統都以 “vi” 的形式支援它。許多開發人員喜歡使用 Vim 進行各種編輯工作。 Vim 非常穩定，並且不斷發展而變得更好。

官網：http://www.vim.org/

特性：

持久、多層次的撤銷樹

#廣泛的外掛系統

支援數百種程式語言和檔案格式

強大的搜尋和取代功能

能夠與許多工具整合

#Vim 外掛程式

vim-jsx - 提供JSX 的語法高亮與縮排。

vim-react-snippets - 一組為 Vim 打造的可與Facebook 的 React 函式庫一起使用的片段。

vim-babel - 一組為 Vim 打造的可與Facebook 的 React 函式庫一起使用的片段。

Spacemacs 編輯器

Spacemacs 是一個社群驅動的Emacs 發行版- 最好的編輯器既不是Emacs 也不是Vim，它是Emacs 和Vim 相結合！

官網：http://spacemacs.org/

特性：

金鑰綁定使用助記符前綴進行組織

可發現 - 創新的即時顯示可用的鍵綁定。

相似的功能具有與之相同的金鑰

簡單的查詢系統可以快速找到可用的層、套件等。

社群驅動的配置提供了強大的用戶可調的包，bug 可快速修復。

擴充功能

React layer - 適用於 React 的 ES6 和 JSX 配置層。它將自動識別 .jsx 和 .react.js 檔案。一個用於 React整合的包層。

TextMate 編輯器

TextMate 並不是IDE，但透過使用其強大的片段、巨集和獨特的範圍界定係統，它通常可以提供即使是程式語言特定的IDE 都缺乏的功能。 React 不直接支持，但藉助下面的插件可以輕鬆獲得大多數 React 程式碼所基於的 JSX 的支援。

官網：https://macromates.com/

特性：

CSS 選擇器可決定操作和設定的範圍

快速概述和導航功能彈出

可以把你最喜歡的腳本語言作為插件集成

從文檔中運行Shell 命令

代碼高亮

可與Xcode 協作並建構Xcode 專案

外掛程式

javascript-jsx.tmbundle - 用於JSX（React）的Textmate Bundle。目前支援語法高亮。

以上是寫react用什麼編輯器的詳細內容。更多資訊請關注PHP中文網其他相關文章！