-
[React-Native] 셋팅(Mac, android)React-Native 2024. 4. 24. 20:39728x90반응형
저번 글에서는 IOS만 쓰고 안드로이드 셋팅하는 걸 깜빡하고 안 써서 따로 작성해본다
1. Node, Watchman 설치
brew install node
brew install watchman이미 IOS를 셋팅할 때 설치했기 때문에 패스
2. JDK(Java Development Kit) 설치
brew tap homebrew/cask-versions
brew install --cask zulu17
brew info --cask zulu17터미널에 공홈에서 알려주는 대로 Homebrew를 통해 오픈JDK를 설치하면 된다
Zulu OpenJDK를 사용하면 인텔 기반 JDK를 사용할 때보다 M1 Mac에서 빌드 속도가 빨라진다고 한다(오호)
너무 최신버전으로 설치해도 에러가 발생할 수 있다고하니 (버전이 안 맞아서) 17 버전으로 설치해주자
3. 안드로이드 스튜디오 설치
https://developer.android.com/studio?hl=ko
오랜만에 안드로이드 홈페이지에 가보는데 뭔가 많이 달라진듯???
여튼 안드로이드 스튜디오 홈페이지에서 스튜디오 lguana를 다운로드 받는다
맥북이라면 인텔칩이랑 애플칩 중에 선택해서 다운로드 해야한다
내 맥은 M1이니까 애플칩으로 고고~
설치를 할 때 아래의 항목에 체크를 해서 설치해주도록 하자
- Android SDK
- Android SDK Platform
- Android Virtual Device
참고로 설치할 때 스크린샷은 없어서 생략^^
4. 안드로이드 SDK 설치
안드로이드 스튜디오는 최신 버전의 안드로이드 SDK를 지원하지만 리액트 네이티브 앱을 빌드하려면 Android 13(Tiramisu)가 필요하다고 한다
설치 고고~
More Actions -> SDK Manager -> Languages & Frameworks -> SDK Platforms에서 show package details를 클릭 후 Android 13을 찾는다
Android 13에서 아래의 항목을 찾아 설치한다
- Android SDK Platform 33
- Intel x86 Atom_64 System Image or Google APIs Intel x86 Atom System Image or (for Apple M1 Silicon) Google APIs ARM 64 v8a System Image
M1인 경우에는 Google APIs ARM 64 v8a System Image만 설치하면 돼서 Android SDK Platform 33이랑 Google APIs ARM 64 v8a System Image에만 체크를 해주고 설치해주었다(사진에는 잘려서 나옴)
그리고 SDK Tools -> 마찬가지로 show package details를 클릭 후 Android SDK Build-Tools에서 33.0.0이 설치되어있는지 확인한다
그리고 터미널에 아래와 같이 입력해주고 path를 설정해준다
open ~/.zshrc (혹은 ~/.zprofile)
bash를 사용한다면 ~/.bashrc (혹은 ~/.bash_profile)그러면 파일이 하나 열리는데 파일의 맨 아래에 아래와 같이 안드로이드 경로를 입력해주고 저장해준다
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/platform-tools저장했으면 아래 명령어를 입력해 변경된 내용이 적용되게 실행시켜준다
source ~/.zshrc
아래 명령어를 입력하면 ANDROID_HOME이 어느 경로에 셋팅되어있는지와 아까 파일에서 지정한 path들을 볼 수 있다
echo $ANDROID_HOME
echo $PATH5. 실행
npm start
를 입력해 metro 서버만을 켤 수도 있지만
npm run android
을 사용하면 에뮬레이터에서 앱을 빌드하면서 metro 서버가 같이 켜진다
여튼 켜서 아래와 같은 화면이 뜨면 완성
반응형'React-Native' 카테고리의 다른 글
[React-Native] 폰트 적용하기 (0) 2024.04.26 [error] trailing spaces not allowed.eslintno-trailing-spaces, Delete `⏎`eslintprettier/prettier (0) 2024.04.25 [React-Native] React-Native CLI로 프로젝트 시작, 셋팅(Mac,IOS) (0) 2024.04.24 [React-Native] Android Studio AVD 스킨 추가하기 (0) 2024.04.23 [React-Native] 기본 셋팅 (0) 2024.04.15