Rozwiązywanie problemów

Nieoficjalne Tłumaczenie Beta

Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →

Oto częste problemy, które możesz napotkać podczas konfiguracji React Native. Jeśli trafisz na coś, czego tu nie ma, spróbuj wyszukać problem na GitHubie.

Port już zajęty

Bundler Metro działa na porcie 8081. Jeśli inny proces już używa tego portu, możesz albo zakończyć ten proces, albo zmienić port używany przez bundler.

Kończenie procesu na porcie 8081

Uruchom to polecenie, aby znaleźć ID procesu nasłuchującego na porcie 8081:

shell

sudo lsof -i :8081

Następnie uruchom to, aby zakończyć proces:

shell

kill -9 <PID>

W systemie Windows możesz znaleźć proces używający portu 8081 za pomocą Monitora zasobów i zatrzymać go w Menedżerze zadań.

Użycie portu innego niż 8081

Możesz skonfigurować bundler do używania innego portu niż 8081 za pomocą parametru port. Z głównego folderu projektu uruchom:

npm

shell

npm start -- --port=8088

Yarn

shell

yarn start --port 8088

Będziesz też musiał zaktualizować aplikacje, aby ładowały paczkę JavaScript z nowego portu. Jeśli uruchamiasz na urządzeniu z Xcode, zrób to aktualizując wystąpienia 8081 na wybrany port w pliku ios/__App_Name__.xcodeproj/project.pbxproj.

Błąd blokady NPM

Jeśli podczas używania CLI React Native napotkasz błąd typu npm WARN locking Error: EACCES, spróbuj uruchomić:

shell

sudo chown -R $USER ~/.npm
sudo chown -R $USER /usr/local/lib/node_modules

Brakujące biblioteki React

Jeśli ręcznie dodałeś React Native do projektu, upewnij się, że uwzględniłeś wszystkie używane zależności, np. RCTText.xcodeproj, RCTImage.xcodeproj. Następnie binarne pliki zbudowane przez te zależności muszą zostać podłączone do binarnej aplikacji. Użyj sekcji Linked Frameworks and Binaries w ustawieniach projektu Xcode. Więcej szczegółów znajdziesz tutaj: Łączenie bibliotek.

Jeśli używasz CocoaPods, sprawdź czy dodałeś React wraz z podspecyfikacjami do Podfile. Na przykład, jeśli używasz API <Text />, <Image /> i fetch(), musisz dodać je w swoim Podfile:

pod 'React', :path => '../node_modules/react-native', :subspecs => [
  'RCTText',
  'RCTImage',
  'RCTNetwork',
  'RCTWebSocket',
]

Następnie upewnij się, że uruchomiłeś pod install i że w projekcie powstał katalog Pods/ z zainstalowanym Reactem. CocoaPods poinstruuje cię, aby od teraz używać wygenerowanego pliku .xcworkspace w celu korzystania z tych zależności.

React Native nie kompiluje się przy użyciu CocoaPods

Istnieje wtyczka CocoaPods o nazwie cocoapods-fix-react-native, która obsługuje ewentualne poprawki kodu wynikające z różnic przy używaniu menedżera zależności.

Zbyt długa lista argumentów: rekursywne wyszukiwanie nagłówków nie powiodło się

W ustawieniach budowania projektu User Search Header Paths i Header Search Paths to dwie konfiguracje określające, gdzie Xcode powinien szukać plików nagłówkowych #import podanych w kodzie. Dla Pods, CocoaPods używa domyślnej listy określonych folderów do przeszukania. Sprawdź, czy ta konkretna konfiguracja nie została nadpisana i czy żaden ze skonfigurowanych folderów nie jest zbyt duży. Jeśli któryś folder jest duży, Xcode spróbuje rekursywnie przeszukać cały katalog i w pewnym momencie zgłosi powyższy błąd.

Aby przywrócić ustawienia User Search Header Paths i Header Search Paths do domyślnych wartości ustawionych przez CocoaPods - wybierz wpis w panelu Build Settings i naciśnij delete. Usunie to niestandardowe nadpisanie i przywróci domyślne ustawienia CocoaPods.

Brak dostępnych transportów

React Native implementuje polyfill dla WebSockets. Te polyfille są inicjalizowane jako część modułu react-native, który dołączasz do aplikacji poprzez import React from 'react'. Jeśli ładujesz inny moduł wymagający WebSockets, np. Firebase, upewnij się że wczytujesz go po react-native:

import React from 'react';
import Firebase from 'firebase';

Wyjątek: Polecenie powłoki nie odpowiada

Jeśli napotkasz wyjątek ShellCommandUnresponsiveException, na przykład:

Execution failed for task ':app:installDebug'.
  com.android.builder.testing.api.DeviceException: com.android.ddmlib.ShellCommandUnresponsiveException

Uruchom ponownie serwer ADB, wykonując w terminalu następujące polecenia:

adb kill-server
adb start-server

Problem z uruchomieniem menedżera pakietów react-native (Linux)

Przypadek 1: Błąd "code":"ENOSPC","errno":"ENOSPC"

Problem spowodowany przekroczeniem limitu katalogów, które inotify (używany przez watchman w Linuxie) może monitorować. Rozwiąż go wykonując w terminalu:

shell

echo fs.inotify.max_user_watches=582222 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

Błąd: spawnSync ./gradlew EACCES

Jeśli podczas uruchamiania npm run android lub yarn android w macOS pojawi się powyższy błąd, wykonaj sudo chmod +x android/gradlew aby nadać plikom gradlew uprawnienia wykonywania.