What editor supports react?-JS Tutorial-php.cn

Editors that support react: Nuclide, Atom, Sublime Text, Visual Studio Code, WebStorm, Vim editor, GNU Emacs editor, Spacemacs editor, Deco IDE, TextMate editor, etc.

What editor supports react?

react editor

##1. Nuclide

Github project address: facebook / nuclide(https://github.com/facebook /nuclide)
Documentation:
- Nuclide with React Native: https:/ /nuclide.io/docs/platforms/react-native/
Licence: Open source
Features:
- Remote Development
- Developing Hack
- Support Mercurial
- Working Set

Nuclide is a single package built on top of Atom, which provides programmability and has a very active community. It provides a first-class development environment for React Native, Hack and Flow projects.

2. Atom

## Official website: https://atom.io/

Github project address: atom(https://github.com/atom)
Documentation:
Settings: http://flight-manual .atom.io/
- Atom with React Native: https://blog.sendbird.com/tutorial-build-a-messaging-app-using-react-native/
Licence: Open source
Features:
Cross-platform editing
- Built-in package manager
- Intelligent auto-completion
- File system browser
- Multiple panes
- Find and replace

Atom commonly used packages:

atom-react-native-autocomplete package - This package is for React-Native and provides automatic completion for the Atom editor Function.

atom-react-native-css - This is a package for React-Native components with built-in support for SASS and SCSS. React-native-css converts valid CSS, SASS to the Facebook subset of CSS.
react-native-snippets - This package is React Native snippets for Atom and Nuclide.
zenchat-snippets - It is a collection of snippets for react-native, redux and ES6.
atom-xcode - For integrating Mac Xcode and atom. Once installed, the iOS simulator can be controlled within atom.
language-babel - Contains syntax for all versions of JavaScript, including ES2016 and ESNext, JSX syntax for Facebook React, and etch for Atom.

3. Sublime Text

## Official website: https://www .sublimetext.com/

Documentation:
Settings: https:// www.sublimetext.com/docs/3/
- 为React-JSX development settings SublimeText: (http://www.nitinh.com/2015/02/setting-sublime-text-react-jsx-development/)
- Supported platforms: Windows, Mac, Linux
Features:
Goto Anything Function
- Command Terminal
- Distraction Free Mode
- Instant project switch
- Plugin API
- Customize anything
- Cross-platform
- Setting up React Native: nitinh.com/2015/02/setting-sublime-text-react-jsx-development/
Sublime Text is a sophisticated text editor for writing Code, markup, and write plain text. The community provides a large number of plug-ins to extend its functionality. Sublime Text has always been a favorite editor among developers.

Sublime Text common packages

react-native-snippets - A collection of snippets for Sublime Text in react native

4. Visual Studio Code

Official website: https://code.visualstudio.com/

Github project address: Microsoft/vscode(https://github.com/Microsoft /vscode)

Documentation:

Setup: https://code.visualstudio.com/docs

Use Visual Studio Code to develop React Native applications: https: //blogs.msdn.microsoft.com/visualstudio/2016/02/22/develop-reactnative-apps-in-visual-studio-code/

Supported platforms: Windows, Mac , Linux

Features:

Built-in Git commands

Extensible and customizable

Visual Studio Code is a source code editor developed by Microsoft for Windows, Linux, and OS X. It is free and open source and supports debugging, embedded Git controls, syntax highlighting, smart code completion, code snippets, and code refactoring.

Extension

ReactNative Tools - This extension provides a development environment for React Native projects. You can debug your code, quickly run react-native commands from the command terminal, and use IntelliSense to explore the objects, functions, and parameters of the React Native API.
Vim Editor

5. Vim Editor

Official website: http://www.vim.org/

Github project address: vim/vim(https://github.com/vim/vim)

Documentation:

Vim documentation: http://www.vim.org/docs.php

Setting up Vim for React-JSX: https://jaxbot.me/articles/setting-up -vim-for-react-js-jsx-02-03-2015

License: Open Source

Supported Platforms: Mac, Linux

Features:

Persistent, multi-level undo tree

Extensive plugin system

Supports hundreds of programming languages and file formats

Powerful search and replace functionality

Ability to integrate with many tools

Vim is a highly configurable text editor that can be very Efficiently create and change any type of text. Most UNIX systems support it in the form of "vi". Many developers like to use Vim for various editing tasks. Vim is very stable and constantly evolving to get better.

Vim plugin

vim-jsx - Provides syntax highlighting and indentation for JSX.

vim-react-snippets - A set of snippets built for Vim to be used with Facebook's React library.

vim-babel - A set of snippets built for Vim to be used with Facebook's React library.

6. GNU Emacs Editor

Official website: https:/ /www.gnu.org/software/emacs/

Documentation:

Official documentation: https://www.gnu.org/software/emacs/documentation.html

Initial setup for React Native: http://www.cyrusinnovation.com/initial-emacs-setup-for-reactreactnative/

License: Follow GPL

Supported platforms: Windows, Mac, Linux

Features:

Content-aware editing mode, including syntax coloring, suitable for multiple file types.

Complete built-in documentation, including novice tutorials.

Supports Unicode encoding for almost all scripting languages.

Highly customizable, using Emacs Lisp code or a graphical interface.

Has a package system for downloading and installing extensions.

GNU EMACS is an extensible, customizable, free, and free text editor.

Extensions

web-mode.el - It is an autonomous emacs main module for editing web templates. It is compatible with many languages, including JSX (React).

7. Spacemacs Editor

Official website: http:// spacemacs.org/

Github project address: syl20bnr/spacemacs(https://github.com/syl20bnr/spacemacs)

Documentation:
Official documentation: http://spacemacs.org/doc/DOCUMENTATION.html

License: Open Source

Supported Platforms: Windows, Mac, Linux

Features:

Key bindings organized using mnemonic prefixes

Discoverable - Innovative real-time display of available key bindings.

Similar functions have the same key

A simple query system can quickly find available layers, packages, etc.

Community-driven configuration provides powerful user-tunable packages so bugs can be quickly fixed.

Spacemacs is a community-driven Emacs distribution - the best editor is neither Emacs nor Vim, it's Emacs and Vim combined!

Extensions

React layer - ES6 and JSX configuration layer for React. It will automatically recognize .jsx and .react.js files. A wrapper for React integration.

8. Deco IDE

## Official website: https://www .decosoftware.com/
Github project address: decosoftware/deco-ide(https://github.com/decosoftware/deco-ide)
Documentation:

Official Documentation: https://www.decosoftware.com/docs

Supported Platform: Mac (iOS only)
License: Open Source

Features:

Component search and insertion
Real-time adjustment
New file scaffold

Deco is an IDE built specifically for React Native. It is an all-in-one solution for writing React Native applications that can be downloaded and used without any environment setup. Deco improves the React Native development workflow by focusing on component reuse and enabling users to edit the UI in real time.

9. WebStorm
## Official website: https://www.jetbrains.com /webstorm/

Documentation:

Official documentation: https://www.jetbrains.com/webstorm/documentation/

Use external tools: https:/ /blog.jetbrains.com/webstorm/2016/08/using-external-tools/

License: Fees (Single user $129 for first year)

Support platforms: Windows, Mac, Linux

Features:

Intelligent coding assistance

Support the latest technology

Version control system

Seamless tool integration

Debugging, tracing and testing

Built-in terminal

WebStorm is built on the open source IntelliJ platform. JetBrains has been developed and refined for over 15 years. It offers tight integration with VSC, local history functionality, has a vibrant plugin ecosystem, is fully configurable, and offers a host of other features. WebStorm provides advanced support for React and JSX and provides core coding assistance for React Native applications.

10. TextMate Editor
Official website: https://macromates.com /

Document:

Official document: http://manual.macromates.com/en/

##License: Charge (single User License is 48.75 euros)

Supported platforms: Mac
Features:

CSS selector determines the scope of operations and settings
Quick Overview and navigation pop-ups
Integrate your favorite scripting language as a plug-in
Run Shell commands from the document
Code highlighting
Available Collaborate with Xcode and build Xcode projects Features that specific IDEs lack. React doesn't support it directly, but it's easy to get support for JSX, which most React code is based on, with the help of the plugin below.
plugin

javascript-jsx.tmbundle - Textmate Bundle for JSX (React). Syntax highlighting is currently supported.

For more programming-related knowledge, please visit:
Programming Video Course
! !

The above is the detailed content of What editor supports react?. For more information, please follow other related articles on the PHP Chinese website!