새 맥북(M1 Pro)에 react-native 환경 설정 메모

Today I Learned
,
#1

:computer: M1 Pro 맥북에 react-native환경 설정하면서 메모를 남겨봅니다.

Official : Setting up the development environment


당연히 기본은 official 가이드를 따라간다. 다만 아래와 같은 사항에 유의하면서 따라가자

Node 설치시 참고사항 : n, node, yarn

brew를 바로 node를 설치해도 되지만 node 및 npm 버전을 바꿔가면서 개발할 일이 생긴다. 이럴 때는 n 같은 node version mangement 도구를 이용해보자.


게다가 yarn도 유용하니 다음과 같이 설치했다.

  1. install with brew

    ### WARNING  brew install node  (do not install node seperatly! it make n can not change node version)
brew install yarn --ignore-dependencies
brew install n

  2. n 으로 버전 switch가 안될 경우 다음 링크에서 폴더 생성 및 권한 확인 ( 링크 참고)

    # make cache folder (if missing) and take ownership
sudo mkdir -p /usr/local/n
sudo chown -R $(whoami) /usr/local/n
# make sure the required folders exist (safe to execute even if they already exist)
sudo mkdir -p /usr/local/bin /usr/local/lib /usr/local/include /usr/local/share
# take ownership of Node.js install destination folders
sudo chown -R $(whoami) /usr/local/bin /usr/local/lib /usr/local/include /usr/local/share

M1 사용자라면 주의점

  • JDK를 예전 깔던거 생각하고 적당히 깔면 안된다. Offical 문서에 나왔듯이 M1 Mac을 지원하는 Zulu OpenJDK 를 깔자.
  • Android Studio 설치하기 위해 다운로드 할 때도 M1용인지 잘 보고 다운로드

Expo

  • expo cli 이용해서 build할 때 Xcode가 설치되었음에도 불구하고 찾을수 없다고 설치하겠냐고 나온다면 (Xcode needs to be installed) Xcode 환경설정에서 -> Locations -> Command Line Tools이 선택되어있는지 확인하자.
    image
    image1796×1236 209 KB
#2

Android Build 시 다 설치 한것 같은데 @expo/spawn-async/src/spawnAsync.ts:65:13) 관련 에러가 나거나 gradle 버전이 어쩌구 나올 때는 Android SDK 관련 path 설정에 누락된게 없는지 확인하자. 특히 다른 곳의 안내 말고 react-native official 문서를 따라서 한다. 특히 ANDROID_SDK 말고 ANDROID_SDK_ROOT이 지정되어 있어야 하고 emulator 폴더까지 path 지정해야 emulator 실행까지 자동으로 된다.