web-dev-qa-db-fra.com

Comment exécuter des exemples React-Native?

Je ne trouve aucune instruction sur la façon d'installer et d'exécuter l'un des autres exemples fournis dans ' https://github.com/facebook/react-native/tree/master/Examples ' tel que ' https://github.com/facebook/react-native/tree/master/Examples/Movies '.

Le tutoriel vous dit seulement de faire

react-native init AwesomeProject

qui saisit/ https://github.com/facebook/react-native/tree/master/Examples/SampleApp '.

Si je clone l'intégralité du référentiel 'react-native', puis que je lance

npm install
npm start

À partir du dossier racine ("/ react-native"), puis ouvrez "/react-native/Examples/Movies/Movies.xcodeproj" dans Xcode et exécutez le projet, il semble bien fonctionner. Le simulateur apparaît, affiche un écran d'introduction "Films" pour l'application, puis l'écran rouge de la mort apparaît avec une impression de:

:0

et Terminal, où "npm start" est exécuté sur le dossier racine, affiche:

Error: EISDIR, read
    at Error (native)
[02:35:02] <START> request:/Examples/Movies/MoviesApp.includeRequire.runModule.bundle
iosfacebookreactjsreact-native
13
HelpMeStackOverflowMyOnlyHope

Cela devrait fonctionner simplement en suivant le Tutoriel d'initiation , sauf que vous devez exécuter npm install dans votre répertoire rea-native.

Ensuite, lancez par exemple Movie Project avec Xcode.

Si vous souhaitez "isoler" MovieProject ou un autre exemple de projet natif de réaction, la méthode la plus simple consiste à lancer une nouvelle application native de réaction (react-native init MyAppName) et à simplement copier les fichiers JS de l'exemple de projet (dans l'exemple situé sous le projet Movie) dans le nouveau dossier de l'application.

Et n'oubliez pas de modifier votre fichier iOS/AppDelegate.m.

Vous devez éditer 2 lignes:

jsCodeLocation = [NSURL URLWithString:@"http:/localhost:8081/index.ios.bundle"];

Par:

jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/MoviesApp.bundle"];

ET

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                  moduleName:@"MyAppName"
                                               launchOptions:launchOptions];

Par:

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                  moduleName:@"MoviesApp"
                                               launchOptions:launchOptions];
19
Arnaud Babol

Tout d'abord, répondez aux exigences du guide de démarrage

Ensuite, consultez le répertoire React Native et exécutez les opérations suivantes:

  1. npm install
  2. open Examples/Movies/Movies.xcodeproj

Si vous rencontrez des erreurs lors de la compilation suite à des erreurs de liaison, il peut être utile de supprimer les données dérivées. Quittez Xcode, supprimez /Users/{you}/Library/Developer/Xcode/DerivedData et rouvrez Xcode.

6
Eric Vicenti

Vous pouvez également exécuter la version Android de l'application UIExplorer en exécutant la commande suivante:

./gradlew :Examples:UIExplorer:Android:app:installDebug
./packager/packager.sh

ou ca:

./gradlew :Examples:Movies:Android:app:installDebug
./packager/packager.sh

pour les films par exemple (doit être exécuté sur le dossier react-native).

En outre, vous pouvez exécuter le démon Gradle pour accélérer le temps de génération pour Android.

4
azibi

1) Ouvrez votre terminal et cd à l'exemple spécifique que vous voulez exécuter.

2) lancer npm install

3) lancer npm start

4) Ouvrez l'exemple dans Xcode et lancez-le à partir de làIl devrait bien fonctionner. 

PS: C'était si simple mais beaucoup de réponses me trompent aussi.

2
Rohit Goyal

Vous devez installer node.js dans votre terminal avec

brew install node

ReactNative utilise Node.js pour générer le code Javascript dans le projet.

Ensuite, vous avez besoin de Watchman, un observateur de fichiers de Facebook avec

brew install watchman

React Native utilise Watchman pour reconstruire le code en cas de modification.

La dernière chose à faire est d’installer et d’exécuter un nœud avec une fenêtre Terminal dans le dossier react-native.

npm install
npm start

Vous pouvez maintenant ouvrir un projet à partir du dossier react-native/Examples dans Xcode, puis le construire et l'exécuter.

2
nicopasso
  1. mise à jour de la bière
  2. brassez le noeud d'installation
  3. nœud de mise à niveau (si vous êtes déjà installé)
  4. brasseur installer gardien
  5. npm installer -g react-native-cli
  6. react-native init [nom de l'application] --version 0.24.0 (dépend de la version à utiliser, si cela ne fonctionne pas, utilisez ci-dessous). react-native init [nom app ur] --verbose
  7. cd [nom ur app] 
  8. ouvert.
  9. npm start
  10. atome. (si vous avez installé un atome)
1
Kazuki Kimoto

Je voulais juste mettre à jour ceci pour les personnes qui essaient simplement de lancer un projet/une application existante native-rea comme moi:

Dans le terminal:

  1. npm installer
  2. npm start (doit ouvrir une fenêtre distincte pour exécuter le gestionnaire de packages de réaction ou peut utiliser la fenêtre de terminal existante, le cas échéant, vous devrez ouvrir une nouvelle fenêtre de terminal pour taper la commande à l'étape 3)
  3. réactif natif run-ios/réactif natif run-Android

** vous souhaiterez peut-être exécuter npm update -g (dans le dossier natif de réaction) pour vous assurer que tous les packages npm sont à jour avant d'exécuter npm install

0
itsmcgh

Voici un didacticiel pas à pas pour la création d’une application simple.

1) Commencez par télécharger l'outil cli

2) npm run start

3) démarrez l’application dans le simulateur xcode IOS.

Tutoriel ici: http://www.syntaxsuccess.com/viewarticle/553844b55bbbb6000031f0f9

0
TGH