react native cli로 sample project 만들기

1. Homebrew 설치

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

# 설치확인
brew --version

2. Nodejs 설치

brew install node

# 설치 확인
node -–version
npm --versrion

3. Watchman 설치

brew install watchman

# 설치 확인
watchman -version

4. React Native CLI 설치 X

reactnative.dev/docs/environment-setup

위 가이드를 보면 알 수 있듯이 최신 버전에서는 react-native-cli를 globally 설치하면 안된다.

그렇게 하면 legacy 버전의 2.X 대가 설치되게 되는데 현재 support 되는 버전이 아니다.

뒤에 init으로 npx 명령을 통해 react-native가 설치되면 4.X대가 설치된다. version 정보는 아래 사이트에서 자세히 확인 가능하다.

www.npmjs.com/package/@react-native-community/cli

5. Xcode 설치

Xcode 설치는 developer site에서 직접 xip 파일을 받아서 설치하는 형태로 진행했으며 30GB 정도의 여유 공간이 필요하다.

설치 완료 후 Xcode > Preferences.. > Locations 에서 Command Line Tools 설정 필요

6. Cocoapods 설치

sudo gem install cocoapods

# 설치 확인
pod --version

7. JDK 설치

brew tap AdoptOpenJDK/openjdk
brew install --cask adoptopenjdk

# 설치 확인
java --version

8.  react-native 프로젝트 생성 및 확인

npx react-native init SampleApp

이때 react-native-cli package가 없으면 설치됨

npx react-native run-ios

위 명령을 실행하면 현재 버전에서는 에러가 발생한다.

stackoverflow.com/questions/66062663/react-native-npx-react-native-run-ios-doesnt-work-after-initializing-the-proj

react-native 0.63 버전대에서 debugging module인 flipper-folly쪽 bug가 있는 것으로 보인다.

해결법은 아래와 같다.

cd ios
view Podfile

# use_flipper!
# 를 아래와 같이 변경
# use_flipper!({ 'Flipper-Folly' => '2.3.0' })

pod update
pod install
cd..
npx react-native run-ios

 

참고자료

dev-yakuza.posstree.com/ko/react-native/install-on-mac/

맥(Mac)에 react native 개발 환경 구축하기