Android가 JS 번들을 로드하지 못했습니다.
저는 제 넥서스5(안드로이드 5.1.1)에서 어썸 프로젝트를 실행하려고 합니다.
저는 프로젝트를 빌드하고 장치에 설치할 수 있습니다.하지만 실행할 때 빨간 화면이 나타납니다.
JS 번들을 다운로드할 수 없습니다.개발 서버를 시작하거나 장치를 연결하는 것을 잊으셨습니까?
리액트 네이티브 iOS에서는 jsbundle을 오프라인으로 로드하도록 선택할 수 있습니다.Android에서 동일한 작업을 수행하려면 어떻게 해야 합니까? (또는 적어도 서버 주소는 어디서 구성할 수 있습니까?)
갱신하다
로컬 서버와 함께 실행하려면 react-native 프로젝트 루트 디렉토리에서 다음 명령을 실행합니다.
react-native start > /dev/null 2>&1 &adb reverse tcp:8081 tcp:8081
자세한 내용은 dsissitka의 답변을 참조하십시오.
서버 없이 실행하려면 다음을 실행하여 js 파일을 apk에 번들합니다.
- 를 자에산생성 에 생성합니다.
android/app/src/main curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"
자세한 내용은 kzzf의 답변을 참조하십시오.
("JS" apk"):react-native start
curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"
다릴스리(0.12)에서를 합니다.react-native bundle예상대로 안드로이드 프로젝트로 작업하도록 명령합니다.
다음은 Ubuntu 14.04에서 작동하도록 만들었습니다.
cd (App Dir)
react-native start > /dev/null 2>&1 &
adb reverse tcp:8081 tcp:8081
업데이트: 참조
업데이트 2: @scgough 워크스테이션에서 실행 중인 개발 서버에서 RN(React Native)이 JavaScript를 가져올 수 없기 때문에 이 오류가 발생했습니다.이러한 현상이 발생하는 이유를 여기에서 확인할 수 있습니다.
사용자가 Genymotion 또는 에뮬레이터를 사용하고 있다는 것을 탐지한 RN 앱은 GENYMOTION_LOCALHOST(10.0.3.2) 또는 EMULATOR_LOCALHOST(10.0.2.2)에서 JavaScript를 가져오려고 합니다.그렇지 않으면 사용자가 장치를 사용하고 있다고 가정하고 장치가 DEVICE_LOCALHOST(localhost)에서 JavaScript를 가져오려고 합니다.문제는 개발 서버가 장치가 아닌 워크스테이션의 로컬 호스트에서 실행된다는 것입니다. 따라서 개발 서버가 작동하려면 다음 중 하나를 수행해야 합니다.
- 트래픽을 (장치의 로컬 호스트):8081/tcp에서 (워크스테이션의 로컬 호스트):8081/tcp로 전달합니다.그게 바로 그 adb 명령어가 하는 일입니다.
- RN 앱에서 개발 서버를 찾을 수 있는 위치를 알려줍니다.
좋아요, 여기서 무슨 문제가 있는지 알 것 같아요.그것은 의 버전과 관련이 있었습니다.watchman달리고 있었어요.
셸에서 새셸서실을 합니다.brew update그러면:brew unlink watchman그러면:brew install watchman
이제, 당신은 달릴 수 있습니다.react-native start에서.
는 이 새 셸 실행합니다.react-native run-android내 프로젝트 폴더에서.세상만사가 다 좋습니다.
ps. 저는 원래 워치맨 3.2 버전에 있었습니다.이것은 저를 3.7로 업그레이드했습니다.
pps. 저는 이것이 처음이라 해결책으로 가는 가장 빠른 경로는 아닐 수도 있지만 저에게는 효과가 있었습니다.
장치에서 실행/디버깅에 대한 자세한 정보*
에뮬레이터가 아닌 안드로이드 기기에 앱을 배포하면 다음과 같은 오류와 함께 빨간색 사망 화면이 나타날 수 있습니다.Unable to load JS Bundlereact를 실행하는 컴퓨터가 되도록 장치의 디버그 서버를 설정해야 합니다. IP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
- 장치를 누릅니다.
Menu단추를 채우다 - 를 선택합니다.
Dev Settings - 를 선택합니다.
Debug server host for device또는Change Bundle Location - 기계의 IP와 Reload JS 및 반응 포트를 입력합니다.
192.168.1.10:8081
더 많은 정보: http://facebook.github.io/react-native/docs/running-on-device-android.html
프로젝트 디렉토리에서 실행합니다.
react-native start
출력은 다음과 같습니다.
$ react-native start
┌────────────────────────────────────────────────────────────────────────────┐
│ Running packager on port 8081. │
│ │
│ Keep this packager running while developing on any JS projects. Feel │
│ free to close this tab and run your own packager instance if you │
│ prefer. │
│ │
│ https://github.com/facebook/react-native │
│ │
└────────────────────────────────────────────────────────────────────────────┘
Looking for JS files in
/home/user/AwesomeProject
React packager ready.
[11:30:10 PM] <START> Building Dependency Graph
[11:30:10 PM] <START> Crawling File System
[11:30:16 PM] <END> Crawling File System (5869ms)
[11:30:16 PM] <START> Building in-memory fs for JavaScript
[11:30:17 PM] <END> Building in-memory fs for JavaScript (852ms)
[11:30:17 PM] <START> Building in-memory fs for Assets
[11:30:17 PM] <END> Building in-memory fs for Assets (838ms)
[11:30:17 PM] <START> Building Haste Map
[11:30:18 PM] <START> Building (deprecated) Asset Map
[11:30:18 PM] <END> Building (deprecated) Asset Map (220ms)
[11:30:18 PM] <END> Building Haste Map (759ms)
[11:30:18 PM] <END> Building Dependency Graph (8319ms)
Ubuntu 14.04에서 사용할 수 있는 간편한 솔루션입니다.
react-native run-android
에뮬레이터(이미 실행됨)가 반환됩니다. JS 번들을 다운로드할 수 없습니다. JS 서버를 다시 시작합니다.
react-native start
에뮬레이터에서 Reload JS를 누릅니다.그것은 나에게 효과가 있었다.도움이 되길 바랍니다.
안드로이드 앱에서 Menu(Command + Min Genymotion) -> Dev Settings -> Debug server host & port for device를 열었습니다.
값을 다음으로 설정합니다. localhost:8081
그것은 나에게 효과가 있었다.
여기서 답의 조합을 사용해 본 결과, 이것이 저에게 효과가 있습니다.
저는 지니모션을 에뮬레이터로 사용하고 있습니다.
1 Genymotion 에뮬레이터를 시작합니다.
2 터미널에서
cd AwesomeProject
react-native run-android # it loads in genymotion and fails with bundle error
react-native start > /dev/null 2>&1 & # from dsissitka
adb reverse tcp:8081 tcp:8081 # from dsissitka
3 에뮬레이터에서 다시 로드합니다.
장전!
이제 개발을 시작할 수 있습니다.
휴대폰에서 앱을 삭제합니다!저는 여러 단계를 시도했지만 결국 그것으로 끝났습니다.
- 이전에 앱을 실행하려고 했지만 실패한 경우 안드로이드 기기에서 앱을 삭제합니다.
- 려달을 합니다.
$ react-native run-android - 앱 리액트 레이지 쉐이크로 합니다.
Dev Settings그다에음으로.Debug server host & port for device서버 와 호스트 IP(호스트 IP)를 합니다.8081를 들어, 예를 들어, 기호입니다.192.168.50.35:8081주소를 맥에서당를컴당의다있수니에서 찾을 수.System Preferences -> Network -> Advanced... -> TCP/IP -> IPv4 Address. - Rage Shake를 합니다.
Reload JS.
5.0 adb reverse는 Android 5.0입니다.
"reverse에서 " closed"를 두 번 받는 것은 "error: closed"입니다.
kzzf의 답변을 진행해야 할 것 같습니다.
저는 언급할 충분한 평판이 없지만, 이것은 dsissitka의 대답을 언급하는 것입니다.Windows 10에서도 작동합니다.
다시 한 번 말씀드리지만 명령은 다음과 같습니다.
cd (App Dir)
react-native start > /dev/null 2>&1 &
adb reverse tcp:8081 tcp:8081
다음은 안드로이드(릴리스)에서 앱을 실행하는 간단한 단계입니다.
응용 프로그램 루트로 이동합니다.
이 명령을 실행합니다.
react-native 번들 --platform rodroid --dev false --entry-file index.js --dev-output roid/app/src/main/main/include/index.docs.dll.dll.sbundle --dest 안드로이드/app/src/main/res
모든 파일이 복사되었습니다.
서명된 APK를 만듭니다.
안드로이드 스튜디오를 엽니다.
빌드 > 서명된 APK 생성 > [필요한 정보를 입력하십시오, 이 단계 전에 키 입력을 생성해야 합니다]
APK는 오류 없이 생성되어야 합니다.장치에 설치하면 문제 없이 작동합니다.
또한 기기를 연결하고 안드로이드 스튜디오에서 실행 아이콘을 직접 눌러 테스트할 수 있습니다.
키 입력 생성 중:
C:\Program Files\Java\jdkx.x.x_x\bin으로 이동합니다.
달려.
keytool -genkey -v -keystored:\my_private_key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 - 유효성 10000
그것은 아마도 당신에게 몇 가지 세부사항을 작성하도록 요청할 것입니다.그렇게 하면 키 스트로크 파일(my_private_key)을 얻을 수 있습니다.keystore)를 입력하여 apk에 서명하는 데 사용할 수 있습니다.
나는 리눅스에서 이것을 얻고 있었습니다.react-native run-android할 때 않고 수 없습니다.노드 서버가 아직 실행 중이어서 다음에 실행할 때 제대로 실행되지 않고 앱을 연결할 수 없습니다.
이 Xterm서실행니중으로 죽일 수 있는 입니다.ctrl-c그 창(창문)에서 또는 다음을 사용하여 찾을 수 있습니다.lsof -n -i4TCP:8081그리고나서kill -9 PID.
다음 그럼실을 실행합니다.react-native run-android한 번. 다시시.
와이파이 연결을 확인합니다.
다른 가능성은 와이파이에 연결되어 있지 않거나, 잘못된 네트워크에 연결되어 있거나, 개발 설정에서 IP 주소가 잘못되었을 수 있습니다.왠지 와이파이에서 안드로이드가 끊겼고 저도 모르게 이런 오류가 발생하기 시작했습니다.
다른 답을 찾았습니다.
- adb reverse: Android 5.0+(API 21)에서만 작동합니다.
- 다른 방법: 장치를 흔들어 개발자 메뉴를 열고 Dev Settings, Debug server host for device로 이동한 다음 컴퓨터의 IP 주소와 로컬 dev 서버의 포트를 입력합니다.
업데이트
이제 윈도우에서는 반응 네이티브 시작을 실행할 필요가 없습니다.패키지 관리자가 자동으로 실행됩니다.
지금까지 아무도 언급하지 않은 한 가지 확인해야 할 중요한 사항:로컬 방화벽을 확인하고 방화벽이 꺼져 있는지 확인합니다.
여기에서 내 응답을 확인하십시오. https://stackoverflow.com/a/41400708/1459275
나는 우분투와 안드로이드만 사용하고 있고, 그것을 실행할 수 없었습니다.저는 당신의 패키지를 업데이트하는 아주 간단한 해결책을 찾았습니다.json 파일, 다음 행 변경:
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start"
},
로.
"scripts": {
"start": "adb reverse tcp:8081 tcp:8081 && node node_modules/react-native/local-cli/cli.js start"
},
그런 다음 다음 다음을 입력하여 서버를 실행합니다.
npm run start
이렇게 하면 Android 장치가 전화기에서 로컬로 찾는 대신 컴퓨터에서 노드 서버를 찾을 수 있습니다.
첫 번째 질문은 물리적 장치에서 응용 프로그램을 다시 로드하는 것이었습니다.
물리적 장치(즉, adb를 통해)에서 응용 프로그램을 디버깅할 때 장치의 왼쪽 상단 "action" 버튼을 클릭하여 JS 번들을 다시 로드할 수 있습니다.그러면 옵션 메뉴(Reload, Debug JS remote...)가 열립니다.
이게 도움이 되길 바랍니다.
이 오류는 다음 단계를 수행하여 쉽게 해결할 수 있습니다.
//run the command at /android sdk / platforms-tool folder
adb reverse tcp:8081 tcp:8081
//now come to root folder of your app
1. npm start
2. create 'assets' folder inside rootApp/android/app/src/main/
3. curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"
4. make sure anyone physical or virtual device attached is running.
5. react-native run-android
공식 페이지에 나와 있는 지침에 따라 이 문제를 해결할 수 있습니다.이 문제는 JS 번들이 개발 시스템에 있고 실제 장치 내부의 앱이 JS 번들의 위치를 인식하지 못하기 때문에 실제 장치에서 발생합니다.
Native ( 0은 "React Native (확실히 0.59)" 내부에 .android/app/src/debug/res/xml/react_native_config.xml
<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
<domain-config cleartextTrafficPermitted="true">
<domain includeSubdomains="false">localhost</domain>
<domain includeSubdomains="false">10.0.2.2</domain>
<domain includeSubdomains="false">10.0.3.2</domain>
</domain-config>
</network-security-config>
두 터미널을 동일하게 시작하고 첫 번째 터미널 실행 반응 네이티브 시작 및 두 번째 터미널 반응 네이티브 실행 안드로이드에서 이 문제는 간단한 방법으로 해결됩니다.그리고 행운을 빕니다.
저는 이것이 이상하다는 것을 알았지만 해결책을 찾았습니다.프로젝트 폴더가 읽기 전용이 되어 VS에서 저장할 수 없는 경우가 종종 있었습니다.그래서 나는 NPM을 로컬 사용자 PATH에서 시스템 전체 PATH 글로벌 변수로 전환하자는 제안을 읽었고, 그것은 매력적으로 작용했습니다.
이것이 나의 해결책입니다.
위의 어떤 해결책도 나의 문제를 해결할 수 없고 나를 위해 일하는 아래 단계만 따릅니다.하기 가network-security-config.xml파일
<domain-config cleartextTrafficPermitted="true">
<domain includeSubdomains="true">10.0.2.2</domain>
</domain-config>
...
그런 다음 업데이트AndroidManifest.xml로 철하다.
<application
+ android:networkSecurityConfig="@xml/network_security_config"
...
이봐, 나는 내 반응 네이티브 베어 프로젝트로 이 문제에 직면하고 있었어, IOS 시뮬레이터는 잘 작동하지만 안드로이드는 계속해서 나에게 이 오류를 주었습니다.여기 저에게 효과가 있었던 가능한 해결책이 있습니다.
1단계, 당신의 터미널에서 실행함으로써 adb 장치가 승인되었는지 확인합니다: adb 장치.
인증되지 않은 경우 다음 명령을 실행합니다.
2단계, sudo adb kill-server 3단계, sudo adb start-server
그런 다음 adb devices 명령이 에뮬레이터-5554 장치에 연결된 장치 목록을 표시하는지 확인합니다.
승인되지 않은 대신 장치인 경우 승인되지 않은 대신
4단계, npx 반응-원본 런-스캐너 실행
이것은 제 경우에 효과가 있었습니다.
react-native 디렉토리에서 npm start를 실행하는 것이 저에게 잘 되었습니다.
언급URL : https://stackoverflow.com/questions/32572399/android-failed-to-load-js-bundle
'programing' 카테고리의 다른 글
| 내림차순 날짜순 정렬 - 월, 일 및 연도 (0) | 2023.07.31 |
|---|---|
| MySQL에서 JSON_EXTRACT를 사용하고 따옴표 없이 문자열을 얻으려면 어떻게 해야 합니까? (0) | 2023.07.31 |
| ASPNET ID 2.0에서 사용자 사용 안 함 (0) | 2023.07.31 |
| ScrollView 내부의 TableView 스크롤이 자연스럽게 동작하도록 하는 방법 (0) | 2023.07.31 |
| Android: 태블릿에 세로와 가로를 허용하지만 전화기에 세로를 강제로 설정하시겠습니까? (0) | 2023.07.31 |