Quelle est la signification de «Aucune URL de bundle présente» dans react-native?

200

Lorsque je lance un projet natif réactif, je reçois une erreur no bundle URL present, mais je ne sais pas quelles erreurs je fais, j'étais très confus.

entrez la description de l'image ici

Yingch Xue
la source
2
J'ai rencontré ce problème dans Reaper native iOS app. Ouvrez simplement le xcodeproj dans le dossier ios dans xcode et exécutez-le à partir de là. Assurez-vous que vous n'êtes pas sur proxy.
Abhay Shiro
9
La plupart du temps, effacer le répertoire de construction m'aiderm -rf ios/build/
onmyway133
Cela m'aide dans la plupart des situations. Mais dans ce cas particulier, j'ai pu corriger cette erreur par cette commande (react-native: "0.60.4"):watchman watch-del-all
O. Borcuhin
Cela signifie généralement que votre bundler de métro ne fonctionne pas, certaines personnes l'exécutent dans leurs propres terminaux ou sur le terminal informatique standard. Je ferme généralement le terminal, redémarre l'application et cela le corrige.
Sara Inés Calderón

Réponses:

128

Résolvez l'erreur No bundle URL presenten:

  • Exécutez la commande suivante dans le répertoire racine de votre projet pour supprimer le répertoire de construction iOS et pour tuer les autres sessions React Native (en supposant qu'elles s'exécutent sur le port par défaut 8081) avant de reconstruire:

rm -rf ios/build/; kill $(lsof -t -i:8081); react-native run-ios

  • Mettez à jour votre flux de travail React Native pour éviter que ces erreurs ne se produisent en combinant la combinaison de commandes ci-dessus dans un alias et en l'ajoutant à votre fichier de configuration Bash .bashrc avec cette commande:

echo "alias rni=\"kill \$(lsof -t -i:8081); rm -rf ios/build/; react-native run-ios\"" >> ~/.bashrc; source ~/.bashrc

Vous pouvez maintenant exécuter la version React Native iOS (sans vous soucier de l'apparition des écrans d'erreur rouge courants de la mort) avec un simple raccourci d'alias:

rni

Luke Schoen
la source
1
Très utile pour moi. La seule autre chose que je devais faire était de quitter le simulateur s'il n'était pas déjà fermé.
AnnawanDev
74

J'ai également rencontré ce problème (première fois avec React Native). Le problème a disparu lorsque - alors qu'une simulation ios ( react-native run-ios) était en cours d'exécution - j'ai couru npm installpuisreact-native run-ios nouveau. Dans la fenêtre du terminal, il a montré qu'il groupait, puis le simulateur a montré l'écran de bienvenue.

Consultez ce lien pour les mémoires après que la react-native init PropertyFinderligne ait essayé d'utilisernpm start (celle-ci fonctionne pour moi)

=================================================== ======================

MISE À JOUR pour 16.9

Mon port 8081 a été bloqué par McAfee. L'utilisation directe d'un autre port ne fonctionnait pasreact-native start --port=8082 etreact-native run-ios --port=8082

J'ai essayé presque toutes les solutions données ici. mais rien n'a fonctionné.

        "react": "16.9.0",
        "react-dom": "^16.12.0",
        "react-native": "0.61.5",

Solution:

Recherche 8081 dans Xcode et les a tous remplacés par 8082. Ensuite, exécutez les mêmes commandes pour construire et exécuter l'application. L'application fonctionne bien

react-native start --port=8082
react-native run-ios --port=8082

entrez la description de l'image ici

Skip Suva
la source
2
@dcp Avez-vous essayé d'exécuter plusieurs fois "react-native run-ios" alors qu'il est déjà démarré? Il semble que chaque fois que je lance mon application, je dois le faire au moins deux fois (en attendant environ 2 minutes entre chaque fois).
Skip Suva
fonctionne pour moi, mais j'aimerais trouver une solution à long terme qui n'implique pas cette étape à chaque fois.
mheavers
31

J'ai eu le même problème lorsque j'ai groupé mon application. Vérifiez que votre main.jsbundlecible est votre projet principal

analyser
la source
3
Cela m'est arrivé en quelque sorte dans le cadre de ma mise à niveau 0.60 native.
IonicBurger du
lien vidéo pour le même, youtube.com/watch?v=eCs2GsWNkoo
jrhamza
cela m'est aussi arrivé. mais j'ai cliqué dessus. mais toujours le même problème
Jason G
29

Comme indiqué dans le message d'erreur:

Accepter la licence Xcode / iOS nécessite des privilèges d'administrateur, veuillez exécuter "sudo xcodebuild -license", puis réessayez cette commande.

L'exécution de la commande suivante a fonctionné:

sudo xcodebuild -license
cwRichardKim
la source
tks c'est du travail pour moi après avoir exécuté dans le terminal et intégré dans xcode après
tess hsu
Nan. Je ne travaille toujours pas pour moi. Je cours dans un autre port, 8081 est bloqué
Ashish Singh Rawat
28

Ce problème se produit lorsque vous n'autorisez pas les connexions non sécurisées via localhost, ou peut-être que vous avez essayé d'accepter les connexions non sécurisées via http.

Pour résoudre ce problème, ajoutez ceci sur info.plist:

<key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsArbitraryLoads</key>
        <true/>
        <key>NSAllowsArbitraryLoadsInWebContent</key>
        <true/>
        <key>NSAllowsLocalNetworking</key>
        <true/>
    </dict>
Witalo Benicio
la source
4
Quel héros ce mec est. J'ai sauvé moi et mon macbook de sauter par la fenêtre! J'avais changé mon domaine d'exception de localhostmon adresse de réseau local dans Info.plist et donc il ne résolvait pas. J'ai ajouté un bloc pour «localhost» comme domaine d'exception et cela a fonctionné.
Darius
1
Sérieusement, votre réponse est venue comme un dieu pour moi .... frère vous basculez ..... Je n'ai pas de mots. merci, je suis resté dedans dès jeudi.
Tushar Pandey
26

Fermez votre simulateur et le terminal. Ouvrez-en un nouveau et accédez à votre projet, puis mettez à niveau votre réactif natif comme ceci:

react-native upgrade

Problème dans: Récursion infinie dans RCTFatal lorsque le bundle ne s'exécute pas .

Mateo Marconi
la source
1
oui, mais dans mon cas, je n'avais pas besoin de mettre à niveau. La fermeture du terminal et du simulateur m'a suffi.
gianni
@gianni Quelle version de react-native utilisez-vous actuellement?
Mateo Marconi
1
Cela ne semblait pas faire de différence, voyant toujours l'erreur.
SSH ce
2
Cela a fonctionné pour moi, mais vous devez également fermer le simulateur, puis exécuter run-ios react-native
James O'Brien
1
N'a pas aidé `` `info Aucune version n'est passée. Récupération de la dernière version ... warn La version spécifiée "0.61.5" est déjà installée dans node_modules et satisfait la plage semver "0.61.5". Pas besoin de mettre à niveau `` `
Ashish Singh Rawat
19

Raison:

En effet, l'application ne peut pas trouver le serveur (qui sert l'interface utilisateur - par le code javascript).

Solution:

  • Assurez-vous que tout ce qui concerne la réaction native est fermé (pas nécessaire, juste pour avoir un démarrage propre pour ma solution, après mon explication, vous pouvez comprendre que cela est nécessaire ou non)
  • courir npm run startou d' yarn startabord
  • attendez que cette commande soit terminée (vous verrez généralement Loading dependency graph, done. )
  • courir react-native run-ios/android

Explication:

  • React Native est livré en 2 parties:

    • Partie native
    • Partie Javascript
  • Créer des commandes:

    • react-native run-ios/androidconsiste à créer une partie native puis à la déployer sur les appareils et à démarrer l'application sur les appareils (simulateur / émulateur / appareil réel). Cela prenait généralement 3 à 4 minutes pour terminer.

    • npm run startou yarn startconsiste à créer la partie javascript et à démarrer le serveur de développement pour servir l'interface utilisateur intégrée à l'application. Cela prenait généralement 30 secondes pour terminer.

=> Normalement, la partie javascript se termine d'abord, puis la partie native arrive plus tard. (en fonction du temps utilisé).

=> ceci n'est vrai que pour la première génération (nouvelle génération).

=> pour reconstruire:

  • La partie native a juste pris 10 à 15 secondes pour vérifier les modifications et parce qu'aucune modification pour la partie native => n'a été effectuée avant que la partie javascript ne soit construite et servie. (Je ne suis pas sûr que la partie javascript ait été reconstruite ou non mais cela a pris beaucoup de temps que la partie native)

  • C'est pourquoi nous avons eu ce problème, l'application a fonctionné et a exigé une chose qui n'existait pas encore.

Prime:

  • react-native run-ios/android démarrera automatiquement le serveur de développement pour vous.
  • C'est pourquoi quand tu as couru react-native run-ios/androidjuste aprèsreact-native init <app_name> , tout s'est bien passé. (Parce que la fonction de démarrage automatique et le temps a été pris pour une nouvelle construction comme l'état ci-dessus).
  • D'autres solutions de «suppression» ont fonctionné car elles ont forcé la reconstruction.

Le temps utilisé sur cette réponse était relatif à ma machine => peut différer sur les autres.

Khoa
la source
14

Essayez d'exécuter ce code:

$ sudo xcodebuild -license

Cela peut résoudre le problème. Cela fonctionne pour moi.

Kusal Kithmal
la source
11

J'ai eu la même erreur et j'ai pu exécuter l'application uniquement via Xcode. react-native run-iosn'a pas marché. Pour résoudre le problème, vous devez supprimer le builddossier à YOUR_PROJECT/ios/build/. Après cela, vous devriez pouvoir exécuter à react-native run-iosnouveau votre application . J'espère que cela t'aides.

sonlexqt
la source
9

Dans la plupart des cas, ce problème se produit lorsque la recherche DNS / recherche IP ne parvient pas à trouver localhost.

Solution :

Essayez d'ajouter l'ip localhost à votre fichier hôte, etc.

vous pouvez ajouter les lignes ci-dessous à votre fichier hôte etc (/ etc / hosts)

127.0.0.1 localhost

255.255.255.255 broadcasthost

:: 1 l. ocalhost

Pour confirmer que c'est le problème, vous pouvez frapper l'url du bundle sur safari (si vous l'essayez en chrome cela résoudra mais safari ne pourra pas le résoudre). http: // localhost: 8081 / index.ios.bundle? platform = ios & dev = true & minify = false

Vivek
la source
Après avoir migré vers un tout nouvel ordinateur, c'était ce dont j'avais besoin. TY!
jeffctown
Oui même ici sur un nouvel ordinateur!
Vishal Sakaria
Mon problème était de définir un proxy sur ma configuration réseau, je supprime simplement le proxy et cela fonctionne bien.
Ahmad Khani
8

Assurez-vous que vos paramètres ATS sont corrects dans le fichier .plist.

Vous pouvez trouver le fichier à /ios/{{project_name}}/Info.plist

localhost doit être défini comme cible de demande d'exception comme ceci:

<key>NSAppTransportSecurity</key>
    <dict>
    <key>NSExceptionDomains</key>
    <dict>
        <key>localhost</key>
        <dict>
            <key>NSExceptionAllowsInsecureHTTPLoads</key>
            <true/>
        </dict>
    </dict>
</dict>

* (n'oubliez pas de le supprimer sur la version finale ..)

Serdar Değirmenci
la source
7

Pour moi, le problème était qu'il ne pouvait pas créer le bundle JS. Il n'indique pas l'erreur lors de la construction à partir de Xcode, il n'y a donc aucun moyen de le savoir. Pour trouver l'erreur, exécutez la commande suivante.

react-native bundle --platform ios --dev false --entry-file index.ios.js --bundle-output ./ios/release/main.jsbundle --assets-dest ./ios/release/main.jsbundle

Pour moi, l'erreur était quelque chose avec le composant PureRenderMixin manquant. À laquelle la solution peut être trouvée ici: https://github.com/facebook/react-native/issues/13078 . Fondamentalement, vous devez installer manuellement [email protected]. Cela peut être fait en exécutant cette commande.

npm i --save [email protected]

Ce problème se produit maintenant pour tout le monde, car de nouvelles versions de Reaper Alphas sont publiées (en particulier alpha.5) et elles cassent les versions natives de React.

urbancvek
la source
la commande 'react-native bundle --platform ios --dev false --entry-file index.ios.js --bundle-output ./ios/release/main.jsbundle --assets-dest ./ios/release/ main.jsbundle 'décrira toute erreur dans la construction du bundle. tant que cette commande n'aura pas réussi, run-ios ne fonctionnera pas
eric f.
mon erreur actuelle est que le '@connect' de 'react-redux' n'est pas reconnu en quelque sorte?
eric f.
Essayez peut-être d'ajouter "plugins": ["transform-decorators-legacy"]à votre fichier .babelrc. Ou essayez-le avec le connect HOC.
urbancvek
@urbancvek, pour moi, l'erreur est la suivante The node type SpreadProperty has been renamed to SpreadElementet sa @babelbibliothèque de référencement à l' intérieur de node_modules, je n'ai rien trouvé qui a résolu ce problème.
Daniel
7

Solution -> npm startpuis ouvrez un nouveau terminal et accédez à votre chemin de projet, puis appuyez sur react-native run-ioscela fonctionne pour moi

rahul.sapkal23
la source
7

Ce qui l'a résolu pour moi:

  • Ouvrez une fenêtre de terminal
  • cd dans YOUR_PROJECT/ios
  • Supprimez le dossier de génération avec rm -r build
  • Courez à react-native run-iosnouveau

Vous pouvez également ouvrir le Finder, rechercher YOUR_PROJECT/ioset supprimer le builddossier.

Puis exécutez à react-native run-iosnouveau.

Source: Andrew Bancroft

l3aronsansgland
la source
5

Il s'agit d'un problème avec react-native v0.42.1. Essayez de fermer toutes les instances de terminal et XCode et exécutez:

launchctl unload ~/Library/LaunchAgents/com.github.facebook.watchman.plist
watchman version
react-native run-ios
Shobhit Sharma
la source
3
"Il s'agit d'un problème avec la version native de react0.42.1." - Il existe également avec la version.0.43.
dcp
5

fermez d'abord le simulateur, puis exécutez-les sur le terminal

npm install

react-native run-ios
Pramodya Abeysinghe
la source
5

Il suffit d'exécuter dans le terminal react-native start:

cd your react native app directory/ react-native start 

Il démarrera le packager, maintenant ne fermez pas cette fenêtre de terminal, dans une autre fenêtre de terminal exécutez votre projet. C'est le seul besoin que j'ai trouvé pour le faire fonctionner correctement.

Prakash salawria
la source
4

J'ai trouvé que le moyen le plus simple / le plus rapide de contourner cela est de quitter l'application dans le simulateur (2 x Cmd + Shift + H) et de relancer.

Toby Flemming
la source
4

J'ai eu ce même problème. Mais mon problème était que mon Mac et mon iPhone n'étaient pas sur le même réseau wifi.

Assurez-vous donc qu'ils sont tous dans le même réseau et reconstruisez à nouveau. Si ce n'est pas le cas, essayez les solutions mentionnées par d'autres membres ici.

Abraham Jagadeesh
la source
3

vérifiez votre proxy réseau, mieux vaut l'arrêter.

ou vous devriez trouver un autre moyen de maintenir le serveur de packager

user1684758
la source
Merci, j'ai ouvert le VPN mondial pour traverser la Grande Muraille de Feu!
BaiJiFeiLong
J'ai désactivé la configuration automatique du proxy dans Mac. Cela a fonctionné après 2 jours d'efforts: D ... Merci.
Nirav Jain
J'utilisais en effet un VPN dont je ne me souvenais même pas. le fermer a fonctionné!
Pedro Marques
3

Cela m'est également arrivé après le redémarrage de mon Mac. Une fenêtre de terminal launchPackager s'ouvre lorsque vous exécutez votre application sur le simulateur. J'ai fermé cette fenêtre et terminé le processus (j'ai également cloué le simulateur), puis j'ai exécuté à nouveau run-ios natif et tout fonctionne correctement.

gianni
la source
3

Dans mon cas, le problème a été résolu en redémarrant le adbserveur:adb kill-server && adb start-server

Grzegorz Pawlik
la source
3

J'ai également eu ce problème pour moi ... le problème était que le packer ne fonctionnait pas, il semblait probablement parce que mon shell par défaut était zsh. des pneus natifs pour ouvrir une nouvelle fenêtre de terminal et fonctionner, .../node_modules/react-native/packager/launchPackager.commandmais cela n'a pas fonctionné. Le faire manuellement (et le faire fonctionner) a résolu ce problème pour moi.

Chris
la source
3

vérifiez votre clé 'localhost' à NSExceptionDomains dict dans info.plist

s'il n'existe pas, il provoque une erreur.

ogelacinyc
la source
2

En supposant que vous utilisez nvmet plusieurs versions de nœud installées, voici la solution:

  1. Dites que vous exécutez npm install -g react-native-clidans node v6.9.5.
  2. Faites maintenant node v6.9.5par défaut en exécutantnvm alias default 6.9.5
  3. Maintenant, lancez react-native run-ios

Le problème est que vous avez plusieurs versions de nœud installées via nvmet pour installer, react-native-clivous avez changé ou installé la dernière version de nœud, qui n'est pas encore marquée comme nœud par défaut à pointer nvm. Lorsque vous exécutez, react-native run-ioscela ouvre une autre nouvelle fenêtre de terminal dans laquelle la valeur par défaut nvmn'est pas pointée vers la version du nœud où vous avez installé react-native-cli. Suivez simplement la configuration ci-dessus, j'espère que cela devrait vous aider.

Syed
la source
2

assurez-vous que vous avez .jsbundle dans votre projet

Ajouter

react-native bundle --dev false --entry-file index.js --bundle-output ios/main.jsbundle --platform ios

dans votre code natif réactif essayez de rouvrir le projet

Saloni Parikh
la source
1

Je travaille avec RN 0.49.5. J'ai essayé beaucoup de méthodes, mais personne ne fonctionne. Enfin, je l'ai résolu. C'est simple et facile.

L'idée principale est de changer le localhosten 127.0.0.1, mais ce n'est pas là que le RN vous le dit. C'est dans RCTBundleURLProvider.m # - (BOOL) isPackagerRunning: (NSString *) hôte .

Changements de code: oc - NSString *host = ipGuess ?: @"localhost"; + NSString *host = ipGuess ?: @"127.0.0.1"; c'est ok pour le simulateur. S'il s'agit d'un appareil, changez simplement l'adresse IP en celle de votre machine.

Bruce Lee
la source
Pourriez-vous développer votre solution?
Ashish Singh Rawat le
1

une autre chose qui fonctionne pour moi est d'ouvrir le projet dans xcode, puis de le nettoyer et de le construire. généralement, il réexécute le serveur d'emballage et résout le problème.

Eliran Goshen
la source
1

Exécutez la commande ci-dessous:

killall -9 node
rm -rf ios/build
react-native run-ios

il ouvrira launchpackager.command et l'application s'installera sur le simulateur ios

Saif Siddiqui
la source
0

Assurez-vous que vous launchPackage.commandexécutez dans un terminal et essayez à nouveau d'exécuter. Il va construire le bundle. C'est un peu comme webpack-dev-server.

Codler
la source