환경설정을 끝내고 앱 생성까지 해보았으니 안드로이드 에뮬레이터로 실행해봅니다.
1. 에뮬레이터 생성
1) 안드로이드 스튜디오 실행 - Tools - Device Manager 클릭
2) Create device를 눌러 가상장치를 만듭니다.
(저는 Phone은 Pixel 3 , API level은 30 (R)로 선택했습니다.)
2. metro 서버 시작
- 리액트 네이티브 프로젝트를 빌드하여 실행할 때마다 Metro라는 패키지가 시작됩니다.
- 메트로는 모든 자바스크립트 파일을 가져와 단일 파일로 결합하여 제공하는
자바스크립트 번들러입니다. (webpack 같은 느낌)
- 이 서버에서 소스코드를 컴파일하여 앱으로 전송해 줍니다.
1) vscode 실행 - 리액트 네이티브 프로젝트 폴더 열기
2) 터미널 열기 (단축키 : 컨트롤 + ` )
npm start
3. 리액트 네이티브 앱을 에뮬레이터로 실행
1) 터미널 추가 - PowerShell 선택
2) 명령어 실행
npx react-native run-android
# 또는
react-native run-android
빌드가 완료되면 터미널에 BUILD SUCCESSFUL 이라고 나오며 에뮬레이터가 실행됩니다.
※ 빌드할때 실패했던 오류
Android Gradle plugin requires Java 11 to run. You are currently using Java 1.8.
처음에 react-native run-android 로 실행하는데 만난 오류 메시지 😨
FAILURE: Build failed with an exception. * Where: Build file 'C:\react-native\test\android\app\build.gradle' line: 1 * What went wrong: A problem occurred evaluating project ':app'. > Failed to apply plugin 'com.android.internal.application'. > Android Gradle plugin requires Java 11 to run. You are currently using Java 1.8. You can try some of the following options: - changing the IDE settings. - changing the JAVA_HOME environment variable. - changing `org.gradle.java.home` in `gradle.properties`. * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. |
저는 자바8을 설치했고 Android Gradle plugin을 실행하려면 자바 11가 필요했습니다.
🛠️ 해결방법
1. 자바 11 설치
- 설치가 되어있으면 2로 넘어갑니다.
1) 윈도우 작업표시줄 오른쪽 클릭 후 windows PowerShell(관리자)를 클릭
2) 터미널에서 Scoop로 자바11을 설치
* 설치가능 목록 확인 : https://github.com/ScoopInstaller/Java/tree/master/bucket
scoop install git
scoop install corretto11-jdk
설치가 완료되면 시스템 환경 변수도 자동으로 변경됩니다 (JAVA_HOME)
2. 안드로이드 스튜디오 Gradle 세팅 변경
1) 안드로이드 스튜디오 실행 - File - Settings 클릭
2) Build, Execution, Deployment - Build Tools - Gradle 클릭
3) Gradle JDK 변경
저는 제가 설치한 jdk를 선택했는데 (corretto11-jdk) 11 버전이면 다 괜찮을 것 같습니다.
다시 vscode로 돌아와서 에뮬레이터 실행 명령어를 입력해보면 에뮬레이터에 빌드되는 것이 확인됩니다.
혹시 빌드까진 되었는데 화면에 Unable to load Script. 가 나오면
터미널에 react-native run-android 로 다시 실행해 보세요.
그럼 정상적으로 나오는 마법 😂
'React-native' 카테고리의 다른 글
| [React Native] 프로젝트 생성 & JSX 구문 사용 (0) | 2022.04.06 |
|---|---|
| [React Native] 윈도우에서 개발 환경 세팅하기! (0) | 2022.04.03 |