React-Native: Anwendung wurde nicht als Fehler registriert

165

Ich gehe gerade die React-Native-Tutorials durch. Ich begann mit dem Tutorial Erste Schritte, in dem ich ein neues natives Reaktionsprojekt erstellte und es erfolgreich schaffte, das Projekt auf meinem Gerät auszuführen.

Ich habe dann das Requisiten-Tutorial gestartet , das Code-Snippet kopiert und versucht, das Projekt erneut auszuführen. Auf meinem Bildschirm wurde die folgende Fehlermeldung angezeigt:

Adam
quelle
Können Sie Ihren Code teilen?
Jagadish Upadhyay

Antworten:

435

Ich denke, es ist ein Fehler, der dadurch verursacht wird, dass der Name des Projekts und Ihre registrierte Komponente nicht übereinstimmen.

Sie haben ein Projekt mit einem Namen gestartet, dh

react-native init AwesomeApp

In Ihrer Datei index.ios.js registrieren Sie jedoch eine andere Komponente

AppRegistry.registerComponent('Bananas', () => Bananas);

Wenn es muss sein

AppRegistry.registerComponent('AwesomeApp', () => Bananas);

Versuch es zu reparieren.

Slowyn
quelle
7
"Bananen" wie funktioniert für Android. Aber es funktioniert nicht unter IOS.
Sumit Kushwaha
92
Für jemanden, der mit demselben Problem konfrontiert ist, auch wenn der Komponentenname übereinstimmt -> Stellen Sie sicher, dass in einem anderen Terminal kein anderer reaktionsnativer / Knotenprozess ausgeführt wird.
Nilesh
1
Meiner Erfahrung nach hat ein Systemneustart die Dinge sortiert ... so seltsam es klingt.
Kayote
Das Tutorial heißt derzeit "AwesomeProject"
AdamG
2
und für Leute, die Bananen anstelle von AwesomeApp wollen, kann die moduleName:@"AwesemeApp"Zeile in ihrer AppDelegate.m-Datei ändern
Aequitas
42

In den meisten react-native startFällen besteht das Problem darin, dass ein anderer Server (z. B. React Native Packager) entweder auf einem anderen Terminal oder einer anderen Registerkarte von TMUX ausgeführt wird (wenn Sie TMUX verwenden).

Sie müssen diesen Prozess finden und schließen, damit nach dem Ausführen react-native run-iosbeispielsweise ein neuer Packager-Server eingerichtet wird, der für diese bestimmte Anwendung registriert ist.

Finden Sie diesen Prozess einfach mit:

ps aux | grep react-native

Suchen Sie die Prozess-ID (PID) und beenden Sie den Packager-Prozess mit dem killBefehl (z kill -9 [PID]. B. ). Sie sollten die launchPackager.commandApp in macOS finden, nicht sicher über die anderen Betriebssysteme.

Versuchen Sie dann erneut, das run-ios(oder Android) auszuführen . Sie sollten den neuen Pfad nach dem Ausführen des neuen Packager-Servers sehen können, z.

Looking for JS files in
   /Users/afshin/Desktop/awesome-app 
Afshin Mehrabani
quelle
Es funktioniert, auch wenn ich renne react-native start --port <otherport>, sollte ich react-native run-<platform>auf andere Weise rennen ?, Danke
Sebastian Palma
@ SebastiánPalma Soweit ich weiß, führt der startBefehl den Packager-Server aus. Wenn Sie Ihre Anwendung bereits kompiliert haben, müssen Sie dies nicht tun run-<platform>.
Afshin Mehrabani
31

Ändern Sie MainActivitywie folgt :

@Override
protected String getMainComponentName() {
    return "Bananas"; // here
}
Daniyar Saumbayev
quelle
2
GENAU! Das war genau mein Problem, obwohl ich, anstatt dies zu ändern, die
AppRegistry.registerComponent
was ist mit Ios?
Dinesh R Rajput
+1. Ich frage mich, warum die CLI fragt, ob ich der Android / iOS-Version einen anderen Namen geben möchte, wenn dies nur dazu führt, dass mein Projekt nicht funktioniert und ich es zurück ändern muss.
Berühren Sie
Ich hatte app.js geändert
roll
28

Meine Lösung besteht darin, den Modulnamen in "AppDelegate.m" zu ändern.

von moduleName:@"AwesomeProject"

zu moduleName:@"YourNewProjectName"

user8637708
quelle
Dies hat mein Problem behoben. Vielen Dank!
Cory McAboy
Arbeitete für mich mit iOS-Simulator von React Native!
Emilio
Ja, das hilft mir. Ein weiterer Hinweis: Wenn Sie XCode verwenden, stellen Sie sicher, haben Sie den richtigen Namen zu Ihrem App-Namen (Projekt -> Target -> Display) gesetzt
Suther
17

Zunächst müssen Sie Ihre Bewerbung starten:

react-native start

Anschließend müssen Sie Ihren Anwendungsnamen als erstes Argument von registerComponent festlegen.

Es funktioniert gut.

AppRegistry.registerComponent('YourProjectName', () => YourComponentName);
Rafael Ferraro
quelle
8

Bitte überprüfen Sie Ihre app.json-Datei im Projekt. Wenn es keinen Zeilen-AppKey gibt, müssen Sie ihn hinzufügen

{
  "expo": {
    "sdkVersion": "27.0.0",
    "appKey": "mydojo"
  },
  "name": "mydojo",
  "displayName": "mydojo"
}
mperk
quelle
3
Ich habe mich in den letzten 24 Stunden in diesen Fehler eingemischt. Dies hat mein Problem behoben. Vielen Dank!
Balaji Kartheeswaran
7

In meinem Fall gibt es diese Zeile in MainActivity.java, die bei der Verwendung von react-native-renamecli (von NPM) übersehen wurde.

protected String getMainComponentName() {
    return "AwesomeApp";
}

Natürlich musst du es in den Namen deiner App umbenennen.

xemasiv
quelle
4

Ich denke, der Knotenserver läuft von einem anderen Ordner. Also töte es und starte im aktuellen Ordner.

Suchen Sie den laufenden Knotenserver: -

lsof -i :8081

Beenden Sie den laufenden Knotenserver: -

kill -9 <PID>

Z.B:-

kill -9 1653

Starten Sie den Knotenserver vom aktuellen reaktiven nativen Ordner: -

react-native run-android

Arshid KV
quelle
3

Ich hatte das gleiche Problem und für mich war die Hauptursache, dass ich den Packager aus einem anderen reaktionsnativen Ordner (AwesomeApp) ausgeführt habe (React-Native Start), während ich ein anderes Projekt in einem anderen Ordner erstellt habe.

Das Ausführen des Packagers aus dem Verzeichnis der neuen App hat das Problem behoben.

la5zl0
quelle
1

Dies kann auch daran liegen, dass der Name der Stammkomponente mit Kleinbuchstaben beginnt.

Korrigieren Sie es oder erstellen Sie das Projekt erneut mit einem PascalCase-Namen.

zB neues HelloWord entzünden

Venkat
quelle
1

Alle gegebenen Antworten haben bei mir nicht funktioniert.

Ich hatte einen anderen Knotenprozess in einem anderen Terminal, ich schloss dieses Befehlsterminal und alles funktionierte wie erwartet.

Khemraj
quelle
1

Sie müssen registrieren es in index.android.js / index.ios.js

so was:

'use strict';

import {
    AppRegistry
} from 'react-native';

import app from "./app";

AppRegistry.registerComponent('test', () => app);
linSir
quelle
1

Ich habe dieses Problem behoben, indem ich Folgendes in der Datei app.json geändert habe. Es scheint, dass der Großbuchstabe diesen Fehler ausgelöst hat.

Von:

{
  "name": "Nameofmyapp",
  ...
}

Zu:

{
  "name": "nameofmyapp",
  ...
}
Alex Sarnowski
quelle
0

Anstatt den Namen zu ändern AppRegistry,

Führen Sie "React-Native Init Bananas" aus. Dadurch wird ein React Boilerplate-Code für das Bananas-Projekt erstellt und AppRegistry.registerComponentautomatisch auf Bananen verwiesen

AppRegistry.registerComponent('Bananas', () => Bananas);
vipul srivastav
quelle
0

Keine der Lösungen hat bei mir funktioniert. Ich musste den folgenden Prozess abbrechen und React-Native Run-Android erneut ausführen, und es funktionierte.

Knoten ./local-cli/cli.js starten

G. Thabit
quelle
1
Welche folgenden Prozesse?
Bigmadwolf
@bigmadwolf Knoten ./local-cli/cli.js Start
G. Thabit
0

Ich hatte das gleiche Problem. Ich habe Windows zum Erstellen einer reaktionsfähigen nativen App für Android verwendet und hatte den gleichen Fehler. Folgendes hat funktioniert.

  • Navigieren Sie zu dem Ordner ANDROID in Ihrem Stammverzeichnis.
  • Erstellen Sie eine Datei mit dem Namen: local.properties
  • Öffnen Sie es im Editor und schreiben Sie:

sdk.dir = C: \ Benutzer \ BENUTZERNAME \ AppData \ Local \ Android \ sdk

  • Ersetzen Sie USERNAME durch den Namen Ihres Computers.

Speichern Sie die App und führen Sie sie normal aus. Das hat bei mir funktioniert.

Utsav Chawla
quelle
0

Das Problem tritt auch auf, wenn Sie in index.js die App anders benannt haben als den Namen, den Sie für das Android / iOS-Paket angegeben haben . Wahrscheinlich ist dies passiert, als Sie die App ausgeworfen haben. AppRegistry.registerComponent('someappname', () => App)Stellen Sie daher sicher, dass beim Aufrufen somppppname auch für die nativen Pakete oder umgekehrt verwendet wird.

Gabriel P.
quelle
0

Ich habe herausgefunden, wo das Problem in meinem Fall liegt (Windows 10-Betriebssystem), aber es könnte auch unter Linux helfen (Sie könnten es versuchen).

In windows power shell, wenn Sie eine Anwendung ( zum ersten Mal nach dem PC - Boot) ausgeführt werden sollen , indem Sie den folgenden Befehl ausführen,

react-native run-android

Es beginnt ein node process/JS serverin einem anderen console panel, und Sie stoßen nicht auf diesen Fehler. Aber, wenn Sie ausführen möchten eine andere App , Sie müssen müssen schließen , dass bereits ausgeführt JS server console panel wird . Führen Sie dann denselben Befehl für eine andere App aus dem aus power shell. Dieser Befehl startet automatisch einen neuen JS-Server für diese App, und dieser Fehler tritt nicht auf.

Sie müssen nicht schließen und erneut öffnen, power shell um eine andere App auszuführen. Sie müssen schließen node console , um eine andere App auszuführen.

Shamsul Arefin Sajib
quelle
0

Nachdem ich alles oben Genannte gelesen habe, habe ich festgestellt, dass es einen anderen Grund dafür geben könnte.

In meinem Fall:

React-Native-Cli: 2.0.1

reaktionsnativ: 0,60,4

und folgende Struktur:

Geben Sie hier die Bildbeschreibung ein

Zunächst muss beachtet werden, dass index.android in Android Studio nicht aktualisiert wird, wenn der Build von Metro Builder (React-Native Run-Android) ausgeführt wird, sodass er manuell ausgeführt werden muss. Auch im Android Studio "liest" man das nicht

app.json (standardmäßig zusammen mit index.js erstellt, das in index.android.js umbenannt wurde):

 {
    "name": "authApp",
    "displayName": "authApp"
 }

und so mag das

(in meinem Fall)

import {authApp as appName} from './app.json';

verursachen die Tatsache, dass Android Studio nicht weiß, worauf sich authApp bezieht. Ich behebe im Moment, dass ich mich auf den App-Namen mit seinem String-Namen beziehe und diesen Import aus app.json nicht verwende:

AppRegistry.registerComponent('authApp', () => MyApp);
Carmine Tambascia
quelle
0

Das hat es für mich gelöst

AppRegistry.registerComponent('main', () => App);

Also meine index.jsAkte

import { AppRegistry } from 'react-native';
import App from './App';
AppRegistry.registerComponent('main', () => App);

Und meine package.jsonAkte:

"dependencies": {
    "react": "^16.13.1",
    "react-dom": "~16.9.0",
    "react-native": "~0.61.5"
},
Babajide M. Moibi
quelle
0

Diese Lösung hat bei mir nach 2 Tagen Debugging funktioniert. Ändere das :

AppRegistry.registerComponent('AppName', () => App);

zu

AppRegistry.registerComponent('main', () => App);
Agerxs
quelle