Maison  >  Article  >  interface Web  >  Quel éditeur prend en charge React ?

Quel éditeur prend en charge React ?

青灯夜游
青灯夜游original
2020-11-23 12:00:291595parcourir

Éditeurs prenant en charge React : Nuclide, Atom, Sublime Text, Visual Studio Code, WebStorm, éditeur Vim, éditeur GNU Emacs, éditeur Spacemacs, Deco IDE, éditeur TextMate, etc.

Quel éditeur prend en charge React ?

éditeur de réaction

Nuclide

  • Site officiel : https://nuclide.io/
  • Adresse du projet Github : facebook/nuclide(https://github.com/facebook /nuclide)
  • Documentation :
    • Configuration : https://nuclide.io/docs/editor/setup/
    • Nuclide avec React Native : https://nuclide.io/docs/editor/setup/
    Nuclide avec React Native : https://nuclide. io/docs/platforms/react-native/
  • Plateformes prises en charge : Windows, Mac, Linux
  • Licence : Open source
      Fonctionnalités :
    • Débogage intégré
    • Développement à distance
    • Développement Hack
    • Prend en charge Mercurial
    Workset

Nuclide est un package distinct construit sur Atom, qui offre une programmabilité et possède une communauté très active. Il fournit un environnement de développement de premier ordre pour les projets React Native, Hack et Flow. 2.Atom

  • Site officiel : https://atom.io/
  • Adresse du projet Github : atom (https://github.com/atom)

      Documentation :
    • Paramètres : http://flight- manuel .atom.io/
    Atom avec React Native : https://blog.sendbird.com/tutorial-build-a-messaging-app-using-react-native/
  • Plateformes prises en charge : Windows, Mac, Linux
  • Licence : Open Source
      Caractéristiques :
    • Édition multiplateforme
    • Gestionnaire de packages intégré
    • Auto-complétion intelligente
    • Navigateur du système de fichiers
    • Volets multiples
    Rechercher et remplacer

Atom est un éditeur de texte moderne, facile à utiliser et contrôlable. Atom est largement utilisé par les développeurs dans de nombreux langages de programmation. Il possède une communauté vaste et active qui a produit de nombreux plug-ins utiles.

Packages Atom couramment utilisés :
  • Package atom-react-native-autocomplete - Ce package est pour React-Native et fournit la complétion automatique pour l'éditeur Atom Fonction.
  • atom-react-native-css - Il s'agit d'un package pour les composants React-Native avec prise en charge intégrée de SASS et SCSS. React-native-css convertit les CSS valides, SASS en sous-ensemble Facebook de CSS.
  • react-native-snippets - Ce package contient des extraits de code React Native pour Atom et Nuclide.
  • zenchat-snippets - Il s'agit d'une collection d'extraits pour React-Native, Redux et ES6.
  • atom-xcode - Pour intégrer Mac Xcode et atom. Une fois installé, le simulateur iOS peut être contrôlé au sein d'Atom.
langue-babel - Contient la syntaxe pour toutes les versions de JavaScript, y compris ES2016 et ESNext, la syntaxe JSX pour Facebook React et Etch pour Atom.

3. Texte Sublime

  • Site officiel : https:// www .sublimetext.com/
  • Adresse du projet Github : SublimeText(https://github.com/SublimeText)
      Documentation :
    • Paramètres : https:/ / www.sublimetext.com/docs/3/
    • SublimeText pour React Native : https://zaicheng.me/2016/06/20/react-native-initial-setup/
    sont les paramètres de développement React-JSX SublimeText : (http://www.nitinh.com/2015/02/setting-sublime-text-react-jsx-development/)
  • Plateformes prises en charge : Windows, Mac, Linux
  • Licence : vous pouvez le télécharger et l'essayer gratuitement. Vous devez acheter une licence pour continuer à l'utiliser.
      Caractéristiques :
    • Fonction Aller à n'importe quoi
    • Sélection multiple
    • Terminal de commande
    • Mode sans distraction
    • Édition fractionnée
    • Changement instantané de projet
    • API du plugin
    • Personnalisez tout
    Multiplateforme
Paramètre React Native : nitinh.com/2015/02/setting-sublime-text-react-jsx-development/

Sublime Text est un éditeur de texte sophistiqué pour écrire du code, du balisage et écrire du texte brut. . La communauté propose un grand nombre de plug-ins pour étendre ses fonctionnalités. Sublime Text a toujours été un éditeur préféré parmi les développeurs.

Packages communs Sublime Text
  • react-native-snippets - une collection d'extraits pour Sublime Text dans React Native
babel-sublime - Définition de la syntaxe pour ES6 JavaScript avec extension React JSX.

4. Code Visual Studio

  • Site officiel : https://code.visualstudio.com/
  • Adresse du projet Github : Microsoft/vscode(https://github.com/ Microsoft /vscode)
  • Documentation :
    • Configuration : https://code.visualstudio.com/docs
    • Développer des applications React Native à l'aide de Visual Studio Code : https : //blogs.msdn.microsoft.com/visualstudio/2016/02/22/develop-reactnative-apps-in-visual-studio-code/
  • Plateformes prises en charge : Windows, Mac , Linux
  • Caractéristiques :
    • Commandes Git intégrées
    • Extensible et personnalisable

Visuel Studio Code est un éditeur de code source développé par Microsoft pour Windows, Linux et OS X. Il est gratuit et open source et prend en charge le débogage, les contrôles Git intégrés, la coloration syntaxique, la complétion intelligente du code, les extraits de code et la refactorisation du code.

Extension

  • ReactNative Tools - Cette extension fournit un environnement de développement pour les projets React Native. Vous pouvez déboguer votre code, exécuter rapidement des commandes react-native à partir du terminal de commande et utiliser IntelliSense pour explorer les objets, fonctions et paramètres de l'API React Native.
    Éditeur Vim

5. Éditeur Vim

  • Site officiel : http://www.vim.org/
  • Adresse du projet Github : vim/vim(https://github.com/vim/vim)
  • Documentation :

    • Documentation Vim : http://www.vim.org/docs.php
    • Configuration de Vim pour React-JSX : https://jaxbot.me/articles/setting-up -vim-for-react-js-jsx-02-03-2015
  • Licence : Open Source

  • Plateformes prises en charge : Mac, Linux
  • Caractéristiques :
    • Arbre d'annulation persistant à plusieurs niveaux
    • Système de plugins étendu
    • Prend en charge des centaines de langages de programmation et de formats de fichiers
    • Fonctionnalité de recherche et de remplacement puissante
    • Possibilité d'intégration avec de nombreux outils

Vim est un éditeur de texte hautement configurable qui peut être créé de manière très efficace et modifier n'importe quel type de texte. La plupart des systèmes UNIX le prennent en charge sous la forme de « vi ». De nombreux développeurs aiment utiliser Vim pour diverses tâches d'édition. Vim est très stable et évolue constamment pour s'améliorer.

Plugin Vim

  • vim-jsx - Fournit une coloration syntaxique et une indentation pour JSX.
  • vim-react-snippets - Un ensemble d'extraits conçus pour Vim à utiliser avec la bibliothèque React de Facebook.
  • vim-babel - Un ensemble d'extraits créés pour Vim à utiliser avec la bibliothèque React de Facebook.

6. Éditeur GNU Emacs

  • Site officiel : https:/ / /www.gnu.org/software/emacs/
  • Documentation :
    • Documentation officielle : https://www.gnu.org/software/emacs/documentation.html
    • Configuration initiale pour React Native : http://www.cyrusinnovation.com/initial-emacs-setup-for-reactreactnative/
  • Licence : suivre GPL
  • Plateformes prises en charge : Windows, Mac, Linux
  • Caractéristiques :
    • Mode d'édition sensible au contenu, y compris la coloration syntaxique, pour plusieurs types de fichiers.
    • Documentation intégrée complète, y compris des tutoriels pour les débutants.
    • Prend en charge le codage Unicode pour presque tous les langages de script.
    • Hautement personnalisable, en utilisant le code Emacs Lisp ou une interface graphique.
    • Possède un système de packages pour télécharger et installer des extensions.

GNU EMACS est un éditeur de texte extensible, personnalisable, gratuit et gratuit.

Extensions

  • web-mode.el - Il s'agit d'un module principal Emacs autonome pour l'édition de modèles Web. Il est compatible avec de nombreux langages, dont JSX (React).

7. Éditeur Spacemacs

  • Site officiel : http:// spacemacs.org/
  • Adresse du projet Github : syl20bnr/spacemacs(https://github.com/syl20bnr/spacemacs)
  • Documents :
    • Documents officiels : http://spacemacs.org/doc/DOCUMENTATION.html
  • Licence : Open Source
  • Plateformes prises en charge : Windows, Mac, Linux
  • Caractéristiques :
    • Raccords de touches organisés à l'aide de préfixes mnémoniques
    • Détectable - Affichage innovant en temps réel des raccourcis clavier disponibles.
    • Les fonctions similaires ont la même clé
    • Système de requête simple pour trouver rapidement les couches, packages, etc. disponibles.
    • La configuration pilotée par la communauté fournit de puissants packages réglables par l'utilisateur afin que les bogues puissent être rapidement corrigés.

Spacemacs est une distribution Emacs pilotée par la communauté - le meilleur éditeur n'est ni Emacs ni Vim, c'est Emacs et Vim combinés !

Extensions

  • Couche React - Couche de configuration ES6 et JSX pour React. Il reconnaîtra automatiquement les fichiers .jsx et .react.js. Un wrapper pour l’intégration de React.

8. IDE Déco

  • Site officiel : https:// www .decosoftware.com/
  • Adresse du projet Github : decosoftware/deco-ide(https://github.com/decosoftware/deco-ide)
  • Documentation :
    • Documentation officielle : https://www.decosoftware.com/docs
  • Plateforme prise en charge : Mac (iOS uniquement)
  • Licence : Open Source
  • Caractéristiques :
    • Recherche et insertion de composants
    • Ajustements en direct
    • Nouveau support de fichier

Deco est un IDE spécialement conçu pour React Native. Il s'agit d'une solution tout-en-un pour écrire des applications React Native qui peuvent être téléchargées et utilisées sans aucune configuration d'environnement. Deco améliore le flux de travail de développement React Native en se concentrant sur la réutilisation des composants et en permettant aux utilisateurs de modifier l'interface utilisateur en temps réel.

9.WebStorm

  • Site officiel : https://www.jetbrains. com /webstorm/
  • Documentation :
    • Documentation officielle : https://www.jetbrains.com/webstorm/documentation/
    • Utilisation d'outils externes : https : / /blog.jetbrains.com/webstorm/2016/08/using-external-tools/
  • Licence : Frais (utilisateur unique 129 $ pour la première année)
  • Supporté plates-formes : Windows, Mac, Linux
  • Caractéristiques :
    • Assistance au codage intelligent
    • Prise en charge des dernières technologies
    • Système de contrôle de version
    • Intégration transparente des outils
    • Débogage, traçage et tests
    • Terminal intégré

WebStorm est construit sur la plateforme open source IntelliJ . JetBrains a été développé et affiné depuis plus de 15 ans. Il offre une intégration étroite avec VSC, une fonctionnalité d'historique local, dispose d'un écosystème de plugins dynamique, est entièrement configurable et offre une foule d'autres fonctionnalités. WebStorm fournit une prise en charge avancée de React et JSX et fournit une assistance de codage de base pour les applications React Native.

10. Éditeur TextMate

  • Site officiel : https://macromates.com /
  • Document :
    • Document officiel : http://manual.macromates.com/fr/
  • Licence : Charge (unique La licence utilisateur est de 48,75 €)
  • Plateformes prises en charge : Mac
  • Fonctionnalités :
    • Sélecteurs CSS pour définir les actions et les paramètres
    • Aperçu et navigation rapides pop-up
    • Intégrez votre langage de script préféré sous forme de plug-in
    • Exécutez les commandes Shell à partir du document
    • Mise en surbrillance du code
    • Disponible Collaborez avec Xcode et créer des projets Xcode

TextMate n'est pas un IDE, mais grâce à l'utilisation de ses puissants extraits de code, de ses macros et de son système de cadrage unique, il peut souvent fournir même des langages de programmation Des fonctionnalités spécifiques Les IDE manquent. React ne le prend pas en charge directement, mais il est facile d'obtenir une prise en charge pour JSX, sur lequel est basé la plupart du code React, à l'aide du plugin ci-dessous.

Plugins

  • javascript-jsx.tmbundle - Textmate Bundle pour JSX (React). La coloration syntaxique est actuellement prise en charge.

Pour plus de connaissances liées à la programmation, veuillez visiter : Cours vidéo de programmation ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn