Android에서 JS 번들을로드하지 못했습니다.

Nexus5 (Android 5.1.1)에서 AwesomeProject를 실행하려고합니다.

프로젝트를 빌드하고 장치에 설치할 수 있습니다. 그러나 그것을 실행하면 빨간색 화면이 나타납니다.

JS 번들을 다운로드 할 수 없습니다. 개발 서버를 시작하거나 장치를 연결하는 것을 잊었습니까?

네이티브 iOS에 반응하여 jsbundle을 오프라인으로로드하도록 선택할 수 있습니다. Android에서 동일한 작업을 수행하려면 어떻게해야합니까? (또는 적어도 서버 주소는 어디에서 구성 할 수 있습니까?)

최신 정보

로컬 서버로 실행하려면 react-native 프로젝트 루트 디렉토리에서 다음 명령을 실행하십시오.

1. react-native start > /dev/null 2>&1 &
2. adb reverse tcp:8081 tcp:8081

자세한 내용은 dsissitka의 답변을 참조하십시오.

서버없이 실행하려면 다음을 실행하여 jsfile을 apk에 묶습니다.

1. 아래에 자산 폴더를 만듭니다 android/app/src/main
2. curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"

자세한 내용은 kzzzf의 답변을 참조하십시오.

서버를 실행하면서 react-native start앱의 자산 디렉토리에 번들을 다운로드 하면서 JS 파일을 APK에 묶으려면 :

curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"

다음 릴리스 (0.12) react-native bundle에서는 예상대로 Android 프로젝트에서 작동하도록 명령을 수정 합니다.

다음은 Ubuntu 14.04에서 나를 위해 일한 것입니다.

cd (App Dir)
react-native start > /dev/null 2>&1 &
adb reverse tcp:8081 tcp:8081

업데이트 : 참조

• 기기에서 실행 (Android)
• 장치 경고가 표시되지 않습니까?

업데이트 2 : @scgough React Native (RN)가 워크 스테이션에서 실행되는 dev 서버에서 JavaScript를 가져올 수 없기 때문에이 오류가 발생했습니다. 왜 이런 일이 일어나는지 알 수 있습니다.

https://github.com/facebook/react-native/blob/42eb5464fd8a65ed84b799de5d4dc225349449be/ReactAndroid/src/main/java/com/facebook/react/devsupport/DevServerHelper.java#L116-L137

RN 앱이 Genymotion 또는 에뮬레이터를 사용하고 있음을 감지하면 GENYMOTION_LOCALHOST (10.0.3.2) 또는 EMULATOR_LOCALHOST (10.0.2.2)에서 JavaScript를 가져 오려고 시도합니다. 그렇지 않으면 장치를 사용한다고 가정하고 DEVICE_LOCALHOST (localhost)에서 JavaScript를 가져 오려고 시도합니다. 문제는 dev 서버가 장치가 아닌 워크 스테이션의 로컬 호스트에서 실행되므로 작동하려면 다음 중 하나를 수행해야한다는 것입니다.

• (장치의 로컬 호스트) : 8081 / tcp에서 (워크 스테이션의 로컬 호스트) : 8081 / tcp로 트래픽을 전달합니다. 그것이 adb 명령이하는 일입니다.
• RN 앱에 개발자 서버를 찾을 수있는 곳을 알려주십시오.

좋아, 나는 여기에 문제가 무엇인지 알아 냈다고 생각합니다. watchman내가 실행중인 버전과 관련 이있었습니다.

새 쉘에서 brew update 다음을 실행하십시오 brew unlink watchman .brew install watchman

이제 react-native start프로젝트 폴더에서 실행할 수 있습니다

이 쉘을 열어두고 새 쉘 창을 만들고 react-native run-android프로젝트 폴더에서 실행하십시오 . 세상은 모두 옳습니다.

추신. 나는 원래 워치 맨 3.2 버전에 있었다. 이것은 나를 3.7로 업그레이드했습니다.

pps. 나는 이것에 익숙하지 않아 솔루션으로의 가장 빠른 길은 아니지만 그것은 나를 위해 일했다.

* 장치에서 실행 / 디버깅에 대한 추가 정보 *

에뮬레이터가 아닌 Android 기기에 앱을 배포 하면 오류 메시지와 함께 빨간색 화면이 나타납니다Unable to load JS Bundle . 장치의 디버그 서버를 이름 또는 IP 주소 중 하나 인 반응하는 컴퓨터로 설정해야합니다.

1. 장치 Menu버튼을 누릅니다
2. 고르다 Dev Settings
3. 선택 Debug server host for device또는Change Bundle Location
4. 머신의 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

에뮬레이터에서 JS를 다시로드하십시오. 그것은 나를 위해 일했다. 그것이 도움이되기를 바랍니다.

안드로이드의 앱에서 메뉴 (Genymotion의 Command + M)-> 개발자 설정-> 장치의 서버 호스트 및 포트 디버그를 열었습니다.

값을 localhost : 8081로 설정하십시오.

그것은 나를 위해 일했다.

여기에 답변을 조합하여 시도한 후에 이것이 저에게 효과적입니다.

Genymotion을 에뮬레이터로 사용하고 있습니다.

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 에뮬레이터에서 다시로드하십시오.

로드!

이제 개발을 시작할 수 있습니다.

휴대 전화에서 앱을 삭제하십시오! 나는 여러 단계를 시도했지만 결국 그렇게했습니다.

1. 이전에 앱을 실행하려고했지만 실패한 경우 Android 장치에서 삭제 하십시오.
2. 운영 $ react-native run-android
3. (가) 당신의 안드로이드 장치에 당신의 앱 내에서 흔들어 메뉴를 분노 반작용 열기로 이동 Dev Settings한 다음에 Debug server host & port for device. 서버 IP (컴퓨터의 IP)와 호스트를 입력하십시오 ( 8081예 :) 192.168.50.35:8081. Mac에서는에서 컴퓨터의 IP를 찾을 수 있습니다 System Preferences -> Network -> Advanced... -> TCP/IP -> IPv4 Address.
4. Rage Shake Menu를 다시 열고를 클릭하십시오 Reload JS.

분명히 adb reverse가 Android 5.0에 도입되었습니다
"adb reverse"에서 "error : closed"가 두 번 나타남

kzzzf의 대답으로 진행해야한다고 생각합니다.

나는 의견을 말할만큼 충분한 평판을 얻지 못했지만 이것은 dsissitka의 대답을 말하고 있습니다. Windows 10에서도 작동합니다.

반복적으로 명령은 다음과 같습니다.

cd (App Dir)
react-native start > /dev/null 2>&1 &
adb reverse tcp:8081 tcp:8081

android (release)에서 앱을 실행하는 간단한 단계는 다음과 같습니다.

1. 응용 프로그램 루트로 이동하십시오.

2.이 명령을 실행하십시오.

반응 네이티브 번들-플랫폼 안드로이드 --dev false-엔트리 파일 index.android.js-번들 출력 android / app / src / main / assets / index.android.bundle --assets-dest android / app / src / main / res

모든 파일이 복사됩니다.

3. 서명 된 APK를 만듭니다.

안드로이드 스튜디오를 엽니 다.

빌드> 서명 된 APK 생성> [필요한 세부 사항 작성,이 단계 전에 키 입력을 생성해야합니다.]

APK는 오류없이 생성되어야합니다. 장치에 설치하면 아무런 문제없이 작동합니다.

당신은 또한 당신의 장치를 연결하고 테스트를 위해 안드로이드 스튜디오에서 실행 아이콘을 직접 누르십시오.

키 스트로크 생성 :

1. 고토 C : \ 프로그램 파일 \ 자바 \ jdkx.x.x_x \ 빈

2. 운영

keytool -genkey -v -keystore d : \ my_private_key.keystore -alias my-key-alias -keyalg RSA -keysize 2048-유효성 10000

아마도 몇 가지 세부 사항을 작성하도록 요청할 것입니다. 그것을하고 당신 의 APK에 서명하는 데 사용할 수있는 키 입력 파일 ( my_private_key.keystore )이 있습니다.

react-native run-android프로세스를 중단 한 후 Linux에서 이것을 얻었습니다 . 다음에 노드 서버를 실행할 때 노드 서버가 여전히 실행중인 것 같습니다. 제대로 실행되지 않고 앱을 연결할 수 없습니다.

여기서 수정은 Xterm에서 실행중인 노드 프로세스를 종료하는 것입니다.이 프로세스는 ctrl-c해당 창을 사용하여 죽일 수 있거나 lsof -n -i4TCP:8081then를 사용하여 찾을 수 있습니다 kill -9 PID.

그런 다음 react-native run-android다시 실행 하십시오.

Wi-Fi 연결을 확인하십시오.

또 다른 가능성은 wifi에 연결되어 있지 않거나 잘못된 네트워크에 연결되어 있거나 dev 설정에서 IP 주소가 잘못되었을 수 있습니다. 어떤 이유로 든 내 안드로이드가 wifi에서 연결이 끊어졌고 무의식적 으로이 오류가 발생하기 시작했습니다.

장치에서 실행

다른 답변을 찾았습니다.

• adb reverse : Android 5.0 이상에서만 작동합니다 (API 21).
• 다른 : 장치를 흔들어 개발자 메뉴를 열고 장치 설정 으로 이동하여 장치의 서버 호스트 디버그로 이동 하여 컴퓨터의 IP 주소 와 로컬 장치 서버 의 포트를 입력하십시오

업데이트

이제 Windows에서는 반응 네이티브 시작을 실행할 필요가 없습니다. 패키저가 자동으로 실행됩니다.

지금까지 언급 한 사람이 없는지 확인해야 할 한 가지 중요한 사항 : 로컬 방화벽을 확인하고 방화벽이 꺼져 있는지 확인하십시오 .

내 답변보기 : https : //.com/a/41400708/1459275

Ubuntu와 Android 만 사용하고 있으며 실행할 수 없습니다. package.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

이를 통해 안드로이드 기기는 전화가 아닌 컴퓨터에서 노드 서버를 찾을 수 있습니다.

초기 문제는 phyisical 장치에 응용 프로그램을 다시로드에 대해이었다.

물리적 장치에서 (예 : adb를 통해) 응용 프로그램을 디버깅 할 때 장치의 왼쪽 상단 "작업"버튼을 클릭하여 JS 번들을 다시로드 할 수 있습니다. 옵션 메뉴가 열립니다 (Reload, Debug JS remotely ...).

도움이 되었기를 바랍니다.

이 오류는 다음 단계로 쉽게 해결할 수 있습니다.

    //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 번들이 개발 시스템에 있고 실제 장치 내의 앱이 해당 위치를 인식하지 못하기 때문에이 문제는 실제 장치 에서 발생합니다 .

새로운 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>

동일한 두 번째 터미널과 첫 번째 터미널 실행 반응 네이티브 시작 및 두 번째 터미널 반응 네이티브 실행에서 두 터미널을 시작하면이 문제는 간단하게 해결됩니다. 그리고 행운을 빕니다

이봐, 나는 반응 네이티브 베어 프로젝트 에서이 문제에 직면했다 .IOS 시뮬레이터는 잘 작동하지만 안드로이드는 계속이 오류를 주었다. 여기 나를 위해 일한 가능한 해결책이 있습니다.

1 단계, 터미널에서 adb 장치를 실행하여 권한이 부여되었는지 확인하십시오. adb 장치

권한이없는 경우 다음 명령을 실행하십시오.

2 단계, sudo adb kill-server 3 단계, sudo adb 시작 서버

그런 다음 adb devices 명령이 연결된 장치 에뮬레이터 -5554 장치 목록을 표시하는지 확인하십시오.

무단이 아닌 장치 인 경우 무단이 아닌

4 단계, npx react-native run-android를 실행하십시오.

이것은 내 경우에 효과가 있었으므로 문제가 해결되기를 바랍니다.

나는 이것이 이상하다는 것을 알았지 만 해결책을 얻었다. 나는 때때로 프로젝트 폴더가 읽기 전용으로 바뀌어 VS에서 저장할 수 없다는 것을 알았습니다. 그래서 로컬 사용자 PATH에서 시스템 전체 PATH 전역 변수로 NPM을 전송하라는 제안을 읽었으며 매력처럼 작동했습니다.

react-native 디렉토리에서 npm start 를 실행 하면 나에게 도움이되었습니다.