Nie można załadować skryptu.Upewnij się, że masz uruchomiony serwer Metro lub że pakiet „index.android.bundle” jest prawidłowo zapakowany do wydania

160

react-native run-androidpolecenie kończy się, pozostawiając wiadomość w symulatorze systemu Android. Wiadomość jest następująca:

Nie można załadować skryptu. Upewnij się, że masz uruchomiony serwer Metro lub że pakiet „index.android.bundle” jest prawidłowo zapakowany do wydania.

Zrzut ekranu

Co ja robię źle?

Belle Solutions
źródło
czy możesz wypróbować ten link stackoverflow.com/questions/32572399/… ?
errorau
5
Mam ten sam problem, ponieważ moje urządzenie nie jest podłączone do internetu.
Huo Chhunleng
Ten błąd nadchodzi: throw er; // Nieobsłużone zdarzenie „błędu”
Saeed
znalazłem to i
odłożyłem
@Belle Solution, czy znalazłeś jakieś rozwiązanie?
Hitesh

Odpowiedzi:

94

Nie uruchomiłeś jeszcze pakietu. Uruchom wcześniej npm startlub react-native startw katalogu głównym projektu react-native run-android.

Nerdragen
źródło
najpierw uruchamiam reakcję-natywny start, ale po uruchomieniu reakcji-natywnego run-android zostaje zakończony po pomyślnej kompilacji
Belle Solutions
12
Musisz mieć jednocześnie uruchomione 2 konsole węzłów. Jeden uruchamia i uruchamia pakiet, a drugi uruchamia emulator.
Nerdragen
27
U mnie ten błąd pojawia się, nawet jeśli pakiet jest uruchomiony.
P.Lorand
2
Upewnij się, że port 8081 nie jest zablokowany. Upewnij się również, że używasz jednego terminala do uruchomienia pakietu, poczekaj, aż zakończy ładowanie wykresu zależności, a następnie uruchom responsywny run-android na innym terminalu.
Nerdragen
1
W systemie Windows działa samodzielnie, ale na Linuksie nie, dzięki! Działa idealnie!
Adrian Serna
62

Te kroki naprawdę mi pomagają:

Krok 1: Utwórz katalog w android / app / src / main / asset

Polecenie Linux :mkdir android/app/src/main/assets

Krok 2: Zmień nazwę index.android.js(w katalogu głównym) na index.js( Może istnieje index.jsplik, w takim przypadku nie musisz zmieniać jego nazwy ), a następnie uruchom następujące polecenie:

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

Krok 3: Utwórz plik APK:react-native run-android

Użyj pliku index.js w najnowszej wersji.

Cieszyć się :)

Saeed
źródło
Jaka jest lokalizacja tego pliku w React Native Project index.android.j
Arbaz.
@ Arbaz.in w katalogu głównym.
Saeed
@ Arbaz.in Może index.jsw katalogu głównym znajduje się plik. W takim przypadku nie musisz zmieniać jego nazwy
Saeed
@Saeed tak znalazłem
Arbaz w lipcu
4
To może uruchomić aplikację tylko na chwilę, ale jak to umożliwi debugowanie i ładowanie na gorąco? nie jest to idealne rozwiązanie, aby to zrobić.
buddhiv
39

U mnie ten błąd był spowodowany aktualizacją React-native

Począwszy od systemu Android 9,0 (poziom interfejsu API 28), obsługa tekstu jawnego jest domyślnie wyłączona.

Jeśli sprawdzasz różnicę aktualizacji, musisz utworzyć manifest debugowania android/app/src/debug/AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
</manifest>

Więcej informacji można znaleźć pod adresem : https://stackoverflow.com/a/50834600/1713216

https://react-native-community.github.io/upgrade-helper/

Tomek
źródło
1
Pracował dla mnie na RN 0.61.3.
Żabojad
2
Niestety to nie zadziałało. Miałem już to i nadal pojawia się ten sam błąd, mimo że Metro Bundler działa.
Andrew
Zauważyłem, że czasami potrzebuję dodatkowych nadpisań, jeśli mam zdefiniowaną konfigurację NetworkSecurityConfig, ale wydaje się, że zawsze te ustawienia powodują problemy. Możesz spróbować usunąć dowolną konfigurację zabezpieczeń i określić android:usesCleartextTraffic="true"w głównym, AndroidManifest.xmlczy to działa?
Tom
To zadziałało dla mnie na RN 0.62
KevinAdu
Mam wszystkie te ustawienia, w tym android: usesCleartextTraffic = "true", ale nadal nie mogę uruchomić aplikacji na prawdziwym urządzeniu.
Lucky_girl
25

Najpierw wykonaj kroki 4 i 5, a następnie uruchom swój projekt. Jeśli nie otrzymasz wyniku (z krokami 4 i 5), wykonaj następujące czynności

1- Spróbuj obniżyć wersję Node (aktualna wersja to 12.13.1)

  choco uninstall nodejs
  choco install nodejs --version 12.8

2- Dodaj ścieżkę modułu npm ( C:\Users\your user name\AppData\Roaming\npm) do zmiennych systemowych zamiast zmiennych użytkownika

3- Zainstaluj reaguj natywnie globalnie za pomocą polecenia

  npm install -g react-native-cli

4- Przejdź do katalogu głównego swojego projektu i uruchom następujące polecenie:

  react-native start

5- Otwórz inny terminal w katalogu głównym projektu i uruchom następujące polecenie:

   react-native run-android 

EDYTOWAĆ :

Używasz Genymotion? Jeśli tak, wykonaj następujący krok:

Po wykonaniu powyższego kroku, jeśli pojawi się następujący błąd?

error Failed to launch emulator. Reason: No emulators found as an output of `emulator -list-avds`.

Otwórz swoje genymotion i przejdź do:

genymotion menu -> Settings -> ADB -> Następnie wybierz use custom android sdk tools(kliknij przycisk przeglądania, aby znaleźć lokalizację sdk)

Na koniec ponownie uruchom projekt.

AbolfazlR
źródło
1
12.9 również działało dla mnie, dzięki, zaktualizowałem do wersji 12.13.x i zacząłem otrzymywać powyższy problem.
Huey Mataruse
Tło tej odpowiedzi: github.com/facebook/react-native/issues/26598
Christian Davén
18

Możesz spróbować następujących rzeczy:

Dodaj tę linię do pliku AndroidManifest.xml

<application
[...]
android:usesCleartextTraffic="true"
/>
[...]
</application>
tinmarfrutos
źródło
18

Podobny problem wydarzył się ze mną.
Najwyraźniej Mcafee blokuje port 8081. Zajęło mi to godziny, zanim to rozgryzłem.

Spróbuj biegać:

react-native run-android --port=1234

Gdy aplikacja wyświetla się z błędem na emulatorze, przejdź do ustawień programistycznych ( Ctrl+ M).

Zmień „Host serwera debugowania i port dla urządzenia” na „localhost: 1234”.

Zamknij aplikację i uruchom ją z szuflady aplikacji.

Naveen Kumar
źródło
1
dzięki za podpowiedź musiałem otworzyć port 8081 w moim firewallu i zaczęło działać
ukierunkowanie
Głos za tym wielkim. Jeśli masz Mcafee, spróbuję tego, zadziałało dla mnie.
Puerto
Dzięki, uratowałem mój projekt
Rafid
Utknąłem tu przez dwa dni, nigdy bym nie pomyślał, że to zablokowany port! Wielkie dzięki!
P. Naoum
Próbowałem trafić na localhost: 8081 w przeglądarce, ale bez powodzenia. Trochę badań i okazało się, że macafee zablokował ten port. Podążał twoją drogą. Zaczął działać doskonale.
Tushar Jajodia
17

po prostu dodaj trzy splash w: node_modules \ metro-config \ src \ defaults \ blacklist.js

wymienić tę część:

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];
Alireza
źródło
12

jeśli masz wszystko poprawnie skonfigurowane, spróbuj tego:

adb reverse tcp: 8081 tcp: 8081

Czemu? „Gdy program pakujący RN jest uruchomiony, w przeglądarce dostępny jest aktywny serwer WWW pod adresem 127.0.0.1:8081. To z tego serwera jest udostępniany pakiet JS dla Twojej aplikacji i odświeżany w miarę wprowadzania zmian. Bez odwrotnego proxy, Twój telefon nie mógłby połączyć się z tym adresem ”.

wszystkie kredyty dla Swingline0

Tua Tara
źródło
Czy mógłbyś dodać do swojej odpowiedzi, dlaczego to powinno działać i co robi to polecenie?
creyD
spędziłem cały dzień próbując przełączać biblioteki i to był mój problem
Adam Katz
10

[Szybka odpowiedź]

Po próbie rozwiązania tego problemu w moim obszarze roboczym znalazłem rozwiązanie.

Ten błąd jest spowodowany problemem z Metro używającym niektórych kombinacji wersji NPM i Node.

Masz 2 możliwości:

  • Alternatywa 1: Spróbuj zaktualizować lub obniżyć wersję npm i węzła.
  • Alternatywa 2: Przejdź do tego pliku: \node_modules\metro-config\src\defaults\blacklist.jsi zmień ten kod:

    var sharedBlacklist = [
      /node_modules[/\\]react[/\\]dist[/\\].*/,
      /website\/node_modules\/.*/,
      /heapCapture\/bundle\.js/,
      /.*\/__tests__\/.*/
    ];

    i zmień na to:

    var sharedBlacklist = [
      /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
      /website\/node_modules\/.*/,
      /heapCapture\/bundle\.js/,
      /.*\/__tests__\/.*/
    ];

    Pamiętaj, że jeśli uruchomisz npm installlub a yarn install, musisz ponownie zmienić kod.

Javier C.
źródło
8

To zadziałało dla mnie po wypróbowaniu kilku sposobów.

W pliku node_modules\metro-config\src\defaults\blacklist.js

Zastąpić :

var sharedBlacklist = [
  /node_modules[/\\]react[/\\]dist[/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

z :

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

mam nadzieję że to pomoże.

Mangalprada Malaya
źródło
Działało jak urok, dzięki
César Bermúdez
Dla mnie też zadziałał. Ale dlaczego musiałem to poprawić? Co poszło nie tak?
Mashrur
Wygląda na to, że metro-configużyto \ dla ścieżek zamiast /, co sugeruje ta odpowiedź. Nie rób tego . Modyfikowanie pakietów npm oznacza, że ​​cały zespół musi to robić na swoim komputerze, w CI, podczas przemieszczania, w środowisku produkcyjnym i za każdym razem, gdy metro-config wydaje aktualizację. Lepszym podejściem jest rozwidlenie metro-config na GitHub, zatwierdzenie poprawki, wypchnięcie i przesłanie PR, aby naprawić to dla wszystkich.
Cameron Wilby
6

Począwszy od systemu Android 9,0 (poziom interfejsu API 28), obsługa tekstu jawnego jest domyślnie wyłączona.

Oto, co musisz zrobić, aby pozbyć się tego problemu, jeśli poprawnie wykonujesz normalne polecenia uruchamiania

  1. npm install
  2. reaktywny start
  3. reaguj natywnym run-android

I zmodyfikuj swój plik manifestu Androida w ten sposób.

<application
    android:name=".MainApplication"
    android:icon="@mipmap/ic_launcher"
    android:usesCleartextTraffic="true" // add this line with TRUE Value.
android:theme="@style/AppTheme">
MD. Shafiul Alam Biplob
źródło
5

Po godzinach szukanie odpowiedzi. Rozwiązaniem było utworzenie węzła downgrade do wersji 12.4.

W moim przypadku zdaję sobie sprawę, że błąd występuje właśnie w wersji natywnej 0.60 reaguje z wersją węzła 12.6.

Victor Araújo
źródło
4

Moje rozwiązanie jest następujące:

Uruchom serwer Metro

$ react-native start

Uruchom Androida

$ react-native run-android

Jeśli zobaczysz błąd mówiący „port 8081 jest już używany”, możesz zakończyć ten proces i uruchomić go ponownie

$ react-native start

Zobacz stronę rozwiązywania problemów z React Native .

shizhen
źródło
4

Jeśli korzystasz z systemu Linux, otwórz terminal z katalogu głównego aplikacji i uruchom

npm start

następnie otwórz kolejne okno terminala i uruchom:

react-native run-android
solomon njobvu
źródło
3

Chcę tylko dodać nieoczywistą możliwość, której tutaj nie omówiono. Do wykrywania zmian w sieci, głównie stanu sieci, używam @reak-native-community / netinfo . Aby przetestować stan wyłączonej sieci, należy wyłączyć przełącznik WIFI (na emulatorze). To również skutecznie odcina most między emulatorem a środowiskiem debugowania. Po testach nie włączyłem ponownie WIFI, ponieważ byłem z dala od komputera i natychmiast o nim zapomniałem, gdy wróciłem.

Istnieje możliwość, że może to dotyczyć również kogoś innego i warto to sprawdzić przed podjęciem jakichkolwiek innych drastycznych kroków.

Arunmenon
źródło
3

Miałem ten sam problem, problem dla mnie polegał na tym, że adb nie znajdował się na właściwej ścieżce środowiska, błąd mówi ci o porcie metra, gdy jesteś w adb, porty są zabijane i restartowane.

Dodaj zmienną środowiskową (ADB)

  1. Otwórz zmienne środowiskowe
  2. Wybierz zmienną PATH z drugiej ramki i kliknij opcję edycji poniżej
  3. Kliknij opcję dodawania
  4. Prześlij ścieżkę narzędzi platformy SDK C: \ Users \ My User \ AppData \ Local \ Android \ Sdk \ platform-tools

Uwaga : Lub w zależności od tego, gdzie na komputerze znajduje się plik adb.exe

  1. Zapisz zmiany

Uruchom ponownie kompilację Androida

$ react-native run-android

Lub

$ react-native start

$ react-native run-android
CarlosChavarria
źródło
3

Ja też miałem do czynienia z tym problemem. Rozwiązałem ten kolejny krok.

Sprawdź ścieżkę SDK systemu Android w środowisku Veritable.

Dodaj ANDROID_HOME = C:\Users\user_name\AppData\Local\Android\Sdkw zmiennej systemowej
i C:\Users\user_name\AppData\Local\Android\Sdk\platform-toolsścieżki w zmiennej systemowej

zastąp sharedBlacklist, jak poniżej segmentu kodu,

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

w node_modules / metro-config / src / default / blacklist.js

Następnie uruchom npx React-native run-android --port 9001

Miłego kodowania…!

Chanaka
źródło
2

Doświadczyłem tego tylko dlatego, że moje Wifi zostało omyłkowo wyłączone na moim emulatorze. Włączyłem go z powrotem i zaczęło działać dobrze. Mam nadzieję, że to komuś pomoże

Baba leśna
źródło
2

Rozwiązanie, które zadziałało dla mnie, jest następujące:

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
]; 

Mój przykład kodu

Jorge Santos Neill
źródło
2

zaktualizuj tę część na czarnej liście metra

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];
Hazem AbdelHamid
źródło
2

Napotkałem ten sam problem podczas korzystania z samouczka React Native (programowanie w systemie Linux i kierowanie na Androida).

Ten problem pomógł mi rozwiązać problem w kolejnych krokach. Uruchom następujące polecenia w poniższej kolejności:

  1. (w katalogu projektu) mkdir android/app/src/main/assets
  2. react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
  3. react-native run-android

Możesz zautomatyzować powyższe kroki, umieszczając je scriptsczęściowo w package.jsonten sposób:

"android-linux": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native run-android"

Następnie możesz po prostu wykonać za npm run android-linuxkażdym razem z linii poleceń.

orzech włoski
źródło
1

Domyślnie mały serwer JavaScript o nazwie „Metro Server” działa na porcie 8081.

Musisz udostępnić ten port, aby ten serwer mógł się uruchomić. Więc,

  1. zwolnij port
  2. zamknij urządzenie wirtualne
  3. Znowu „react-native run-android”.

Jak zwolnić port?

http://tenbull.blogspot.com/2019/05/how-to-kill-process-currently-using.html

Jak zabić proces aktualnie używający portu na hoście lokalnym w systemie Windows?

i co najważniejsze, zaktualizowałem wersję mojego węzła z 8.x do 10.x (najnowsza), zgodnie z sugestią facebook @ https://facebook.github.io/react-native/docs/getting-started

Karthik H.
źródło
1

Dla mnie ten problem zaczął się od aktualizacji React-Native. Aktualizacja była konieczna, aby dodać obsługę 64-bitową.

Before:
-------- 
Environment:
Node: 10.15.0
npm: 6.9.0
Watchman: 4.9.0
Xcode: Not Found
Android Studio: 3.4 AI-183.6156.11.34.5692245

Packages: (wanted => installed)
react: 16.0.0-alpha.12 => 16.0.0-alpha.12
react-native: ~0.55.2 => 0.55.4
react-native-cli: 2.0.1

After:
------
info 
React Native Environment Info:
Binaries:
Node: 10.15.0
npm: 6.9.0
Watchman: 4.9.0
SDKs:
Android SDK:
API Levels: 23, 26, 27, 28
Build Tools: 27.0.3, 28.0.3
System Images: android-28 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.4 AI-183.6156.11.34.5692245
Xcode: /undefined - /usr/bin/xcodebuild
npmPackages:
react: ^16.8.6 => 16.9.0 
react-native: 0.59.9 => 0.59.9 
npmGlobalPackages:
create-react-native-app: 2.0.2
react-native-cli: 2.0.1

Ponadto jedna ważna zmiana, którą wprowadziłem podczas aktualizacji, była w ../android/build/build.gradle

android {
    ...
    defaultConfig {
        ...
        targetSdkVersion 28
        ...
    }
    ...
}

Musiałem zmienić targetSdkVersion z 27 na 28 po ostrzeżeniu, kiedy próbowałem załadować kompilację (.apk) do konsoli Google Play. Nie zdawałem sobie sprawy, że to była główna przyczyna powyższego błędu. Natychmiastowe odpowiedzi udzielone przez @tom i @tinmarfrutos miały absolutny sens.

Rozwiązałem problem, dodając android: usesCleartextTraffic = "true" do mojego android / app / src / debug / AndroidManifest.xml

vivekkan
źródło
1

W moim przypadku ustawiłem proxy w moim emulatorze. Po usunięciu tego serwera proxy działa z powrotem do normy.

Benson
źródło
1

możliwość tego błędu to także zła ścieżka, sprawdź raz

 export ANDROID_HOME=/Users/microrentindia/Library/Android/sdk/
 export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
user3143487
źródło
Nigdy o tym nie myślałem. Ale to była odpowiedź dla mnie.
Siraj Alam
1

WAŻNE - możesz mieć wiele urządzeń wirtualnych w swoim środowisku. Upewnij się, że zmieniasz AVD, powtórz ustawienie ponownie.

INFORMACJE O DEBUGIU-

Jeśli masz powyższy błąd, musisz najpierw sprawdzić, co działa na porcie 8081

Najszybszym sposobem znalezienia tego jest użycie następującego polecenia w terminalu

netstat -aon | findstr 8081

jeśli coś ci pokazuje, oznacza to, że port jest zablokowany. jeśli to możliwe, odblokuj ten port.

W przeciwnym razie musisz zmienić port. Proces, który należy wykonać, został już wspomniany w powyższym komentarzu przez Naveena Kumara

react-native run-android --port=9001

Upewnij się, że 9001 również nie jest używany :)

TARJU
źródło
1

Spróbuj wykonać poniższe czynności, jeśli wypróbowałeś wszystkie wymienione powyżej rozwiązania:

  1. Utwórz plik w android / app / src / main / asset
  2. Uruchom następujące polecenie:

pakiet reagowania natywnego - platforma android --dev false --entry-file index.js --bundle-output android / app / src / main / asset / index.android.bundle --assets-dest android / app / src / main / res

  1. Teraz uruchom komendę, aby skompilować, na przykład, react-native run-android
Prayag
źródło
Wow, to pomogło mi częściowo. Przygotowywałem aplikację na rynek Google Play, wszystko, co zrobiłem, to dodałem nowe ikony zasobów dla Androida i zmieniłem docelową wersję na 28. Musiałem zmienić z powrotem na wersję 27 i wszystko zaczęło się od nowa ... Nie wiem, dlaczego reagować nie działać sdk v28.
Michail Pidgorodetskiy
0

Spróbuj wykonać następujące czynności.

  1. Usuń foldery Android i IOS
  2. uruchom wyrzucanie natywnego reagowania
  3. uruchom responsywny run-android

Może po poprzednich krokach masz wykonania npm start - --reset-cache

Pracuję, mam nadzieję, że ci to pomoże.

LuisO
źródło
0

Jeśli korzystasz z systemu operacyjnego Linux, może się zdarzyć, że zdalny serwer npm nie działa. Otwórz inny terminal (z katalogiem projektu) i uruchom to polecenie sudo npm start lub sudo act-native start przed wykonaniem sudo act-native run-android

vicky keshri
źródło
0

Komunikat o błędzie w emulatorze jest trochę mylący. W moim przypadku użyłem Macbooka. Musiałem zmienić uprawnienia w systemie Android / gradlew, uruchamiając $ chmod 755 ./gradlew, a następnie można było zbudować aplikację i wdrożyć ją na emulatorze Androida.

Jane
źródło