소개

react native프로젝트를 생성하는 중 발생한 오류와 해결방법 소개

과정

choco 설치

cmd 창을 관리자 권한으로 실행한 후 아래 명령어 입력

@"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"

node js 설치

위에서 설치한 choco를 활용해 node js를 설치한다 아래 명령어 입력

choco install -y nodejs.install

react native cli 설치

아래 명령어 입력

npm install -g react-native-cli 

jdk 설치

여기서 다른 블로그 글을 참고해 설치했는데 버전이 11 이하라서 오류가 발생했다. 여기서 다운받아 해결했다!

잘 설치 되었는지 확인하기 위해 아래 명령어 입력

choco -version

node -version

npx react-native --version

java -version

android studio 설치

여기서 설치
쭉 쭉 next를 누른후 설치가 완료되었다면 Basic Activity프로젝트 생성 ↓ 아래 명령어 꾹

ctrl + alt + s

JDK를 아까 설치한 11버전으로 변경

환경변수 설정

윈도우 검색창에 시스템 환경 변수 편집 검색

새로운 사용자 변수 생성
이때 변수 값은 Sdk 위치로 해줘야한다

이후 path라는 사용자 변수 클릭 후 새로 만들어준다.
이때 주소는 위의 Sdk 위치 하위 platform-tools폴더로 작성후 확인버튼 꾹

모두 잘 했다면 아래 명령어를 cmd 창에 입력

adb

아래와 같은 결과가 나왔다면 성공!

Android Debug Bridge version 1.0.41
Version 29.0.1-5644136
Installed as /Users/dev-yakuza/Library/Android/sdk/platform-tools/adb

react native 프로젝트 생성

커맨드 창에 아래 명령어 입력

npx react-native init SampleApp

성공적으로 만들어졌다면 아래 명령어 입력

cd SamplApp
react-native start

완료

아래 화면이 애뮬레이터에 나온다면 성공

내가 발생한 오류들

1. 프로젝트 생성을 했지만 app.js 가 생기지 않는 오류

2. cli.init is not a function 오류

이 두가지 오류 모두 한방에 해결했다. 왜인지 모르겠으나

프로젝트를 시작할 폴더를 생성 후
해당 폴더로 이동하는 과정

위 과정을 두번 거치고 프로젝트 생성을 해줬더니 해결이 됐다.
즉 react-native-practice\practice\ 위치에서 아래 명령어를 입력해주니 해결이 되었다.

npx react-native init practice

3. Jdk 버전때문에 발생한 오류

위 과정을 모두 해 준뒤 실행을 했더니 아래 문구가 발생했다.

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.
      Your current JDK is located in C:\Program Files\Java\jdk1.8.0_211\jre

적혀있는 그대로 java 버전때문에 발생한 문제인데
자바 11을 설치하고 android studio에서 경로를 변경해줘도 해결이 되지 않았다.
환경 변수 설정중 사용자 변수가 아닌 시스템 변수의 path로 이동후
jdk11을 제외한 jdk 설정을 모두 제거해주었더니 해결되었다.

마치며

옛날 자바 버전때문에 꽤나 고생을 했다. 환경변수의 중요함을 새삼 느꼈다..

react native 프로젝트 생성하기(2023년, window 기준)

소개

과정