create react app
v5.0.1
Créez des applications React sans configuration de build.
Create React App fonctionne sur macOS, Windows et Linux.
Si quelque chose ne fonctionne pas, veuillez signaler un problème.
Si vous avez des questions ou avez besoin d'aide, veuillez les poser dans les discussions GitHub.
npx create-react-app my-app
cd my-app
npm start Si vous avez déjà installé create-react-app globalement via npm install -g create-react-app , nous vous recommandons de désinstaller le package à l'aide npm uninstall -g create-react-app ou yarn global remove create-react-app pour garantir que npx utilise toujours la dernière version.
(npx est livré avec npm 5.2+ et supérieur, voir les instructions pour les anciennes versions de npm)
Ensuite, ouvrez http://localhost:3000/ pour voir votre application.
Lorsque vous êtes prêt à déployer en production, créez un bundle minifié avec npm run build .
Vous n'avez pas besoin d'installer ou de configurer des outils comme webpack ou Babel.
Ils sont préconfigurés et masqués pour que vous puissiez vous concentrer sur le code.
Créez un projet et vous êtes prêt à partir.
Vous devrez disposer de Node 14.0.0 ou d'une version ultérieure sur votre machine de développement locale (mais ce n'est pas obligatoire sur le serveur). Nous vous recommandons d'utiliser la dernière version LTS. Vous pouvez utiliser nvm (macOS/Linux) ou nvm-windows pour basculer les versions de Node entre différents projets.
Pour créer une nouvelle application, vous pouvez choisir l'une des méthodes suivantes :
npx create-react-app my-app(npx est un outil d'exécution de packages fourni avec npm 5.2+ et supérieur, voir les instructions pour les anciennes versions de npm)
npm init react-app my-app npm init <initializer> est disponible dans npm 6+
yarn create react-app my-app yarn create <starter-kit-package> est disponible dans Yarn 0.25+
Cela créera un répertoire appelé my-app dans le dossier actuel.
Dans ce répertoire, il générera la structure initiale du projet et installera les dépendances transitives :
my-app
├── README.md
├── node_modules
├── package.json
├── .gitignore
├── public
│ ├── favicon.ico
│ ├── index.html
│ └── manifest.json
└── src
├── App.css
├── App.js
├── App.test.js
├── index.css
├── index.js
├── logo.svg
└── serviceWorker.js
└── setupTests.js
Pas de configuration ni de structures de dossiers compliquées, uniquement les fichiers dont vous avez besoin pour créer votre application.
Une fois l'installation terminée, vous pouvez ouvrir le dossier de votre projet :
cd my-appDans le projet nouvellement créé, vous pouvez exécuter certaines commandes intégrées :
npm start ou yarn start Exécute l'application en mode développement.
Ouvrez http://localhost:3000 pour l'afficher dans le navigateur.
La page se rechargera automatiquement si vous apportez des modifications au code.
Vous verrez les erreurs de construction et les avertissements de charpie dans la console.
npm test ou yarn test Exécute l'observateur de test en mode interactif.
Par défaut, exécute les tests liés aux fichiers modifiés depuis la dernière validation.
En savoir plus sur les tests.
npm run build ou yarn build Construit l'application pour la production dans le dossier build .
Il regroupe correctement React en mode production et optimise la construction pour les meilleures performances.
La construction est réduite et les noms de fichiers incluent les hachages.
Votre application est prête à être déployée.
Vous pouvez trouver des instructions détaillées sur l'utilisation de Create React App et de nombreux conseils dans sa documentation.
Veuillez vous référer au Guide de l'utilisateur pour cela et d'autres informations.
Une dépendance : il n'y a qu'une seule dépendance de construction. Il utilise Webpack, Babel, ESLint et d'autres projets étonnants, mais offre en plus une expérience cohérente et organisée.
Aucune configuration requise : vous n'avez rien à configurer. Une configuration raisonnablement bonne des versions de développement et de production est gérée pour vous afin que vous puissiez vous concentrer sur l'écriture du code.
Pas de verrouillage : vous pouvez « éjecter » vers une configuration personnalisée à tout moment. Exécutez une seule commande et toutes les dépendances de configuration et de construction seront déplacées directement dans votre projet, afin que vous puissiez reprendre là où vous vous étiez arrêté.
Votre environnement aura tout ce dont vous avez besoin pour créer une application React moderne d'une seule page :
-webkit- ou d'autres préfixes.[email protected] et versions ultérieures )Consultez ce guide pour un aperçu de la façon dont ces outils s’articulent.
Le compromis est que ces outils sont préconfigurés pour fonctionner d'une manière spécifique . Si votre projet nécessite plus de personnalisation, vous pouvez « l'éjecter » et le personnaliser, mais vous devrez alors conserver cette configuration.
L'application Create React convient parfaitement à :
Voici quelques cas courants dans lesquels vous pourriez vouloir essayer autre chose :
Si vous souhaitez essayer React sans centaines de dépendances d'outils de construction transitives, envisagez plutôt d'utiliser un seul fichier HTML ou un bac à sable en ligne.
Si vous devez intégrer du code React avec un framework de modèles côté serveur comme Rails, Django ou Symfony, ou si vous ne créez pas d'application d'une seule page , envisagez d'utiliser nwb ou Neutrino qui sont plus flexibles. Pour Rails en particulier, vous pouvez utiliser Rails Webpacker. Pour Symfony, essayez le webpack Encore de Symfony.
Si vous devez publier un composant React , nwb peut également le faire, ainsi que le préréglage React-Components de Neutrino.
Si vous souhaitez effectuer un rendu serveur avec React et Node.js, consultez Next.js ou Razzle. Create React App est indépendant du backend et ne produit que des bundles HTML/JS/CSS statiques.
Si votre site Web est principalement statique (par exemple, un portfolio ou un blog), envisagez d'utiliser Gatsby ou Next.js. Contrairement à Create React App, Gatsby pré-rend le site Web en HTML au moment de la construction. Next.js prend en charge à la fois le rendu du serveur et le pré-rendu.
Enfin, si vous avez besoin de plus de personnalisation , consultez Neutrino et son préréglage React.
Tous les outils ci-dessus peuvent fonctionner avec peu ou pas de configuration.
Si vous préférez configurer la version vous-même, suivez ce guide.
Vous cherchez quelque chose de similaire, mais pour React Native ?
Consultez Expo CLI.
Nous serions ravis d'avoir votre coup de main sur create-react-app ! Voir CONTRIBUTING.md pour plus d'informations sur ce que nous recherchons et comment commencer.
Create React App est un projet géré par la communauté et tous les contributeurs sont des bénévoles. Si vous souhaitez soutenir le développement futur de l'application Create React, pensez à faire un don à notre Open Collective.
Ce projet existe grâce à toutes les personnes qui y contribuent.
Merci à Netlify pour avoir hébergé notre documentation.
Nous remercions les auteurs des projets connexes existants pour leurs idées et leur collaboration :
Create React App est un logiciel open source sous licence MIT. Le logo de l'application Create React est sous licence Creative Commons Attribution 4.0 International.
