[Silicon Mac M1] React Native 설치하기

 

급하기 때문에 간단하게 본론만

노트북 산지 얼마 안되서 기본 설정부터 시작한다.

 

1. iTerm 설치 

iterm2.com/downloads.html

Downloads - iTerm2 - Mac OS Terminal Replacement

최신 릴리즈 버전으로 다운로드

 

2. Oh my zsh

MacOS Big Sur 버전부터 bash가 아닌 zsh를 지원한다고 한다

이거는 사실 설치 안해도 되는데 뭐 유용한 기능도 있다고 하고 나는 설치했으므로 일단 ㄱ

iTerm을 열어서 

sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

 

3. Homebrew 설치 

로제타 버전으로 설치한다는데 ( 대충 인텔맥에서 되는걸로 한다는 뜻)

바빠서 설명 생략

/usr/sbin/softwareupdate --install-rosetta --agree-to-license

arch -x86_64 /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

echo "alias brew='arch -x86_64 /usr/local/bin/brew'" >> .zshrc

 

compaudit | xargs chmod g-w,o-w

터미널 종료 후 재시작 

 

 

 

 

그 후 

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

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

이 사이트를 따라해주는데 

jdk 설치 부분에서 cask 부분에서 오류가 나는데 이걸로 대체하면 된다

brew install cask adoptopenjdk8

 

그리고 환경변수에 관해서는

vim ~/.zshrc

이걸로 zshrc을 연다음에 i를 누르고 환경변수 설정하라는걸 따라한다음에 

esc를 누르고 :wq 를 입력하면된다

근데 막 오류나면서 안꺼지면 :q! 이거하면 강제종료라서 아마 될거다...

 

 

프로젝트 생성 및 확인

 

npm config set save-exac=true

 

프로젝트를 생성하고 싶은 경로 cd로 이동한 후 

react-native init HelloWorld

해당 폴더에 HelloWorld라는 프로젝트가 새로 생성된다

 

cd HelloWorld

react-native run-ios
react-native run-android

ios버전과 안드로이드 버전으로 실행시키는 방법인데

아직 안타깝게도 android버전의 에뮬레이터는 m1이 지원하지 않는다고 하고

ios버전으로 시작해보면 

 

이렇게 핸드폰 모양이 뜨는데

그렇게 되면 실패다 ㅎㅎ 

 

리액트 네이티브에서 만들어낸 프로젝트가 제대로 실행되지 않는건데 

cocoapod오류인것으로 생각되는데 해결방법은 다음과 같다

 

<실리콘 맥북 silicon mac M1 version >

 

0. 환경변수 설정

vim ~/.zschr

i를 누른다음에 

export GEM_HOME=$HOME/.gem
export PATH=$GEM_HOME/bin:$PATH

 입력하고 esc 후 :wq를 누르면 됨

 

 

1. iTerm 로제타 버전으로 열기 

iTerm 정보가져오기를 열어서 로제타를 이용해서 열기로 체크해준 후 연다 

 

2. cocoapods 재설치

sudo gem install cocoapods

 

3. ffi 설치

sudo gem install ffi 

sudo를 빼도 될거다 아마..

여튼 이게 핵심

 

3. 해당 폴더로 이동

HelloWorld/ios (만들어둔 리액트 네이티브 폴더내의 ios 폴더로 이동한 후)

cd ~/HelloWorld/ios

 

4. podfile.lock 설치해주기

pod repo update
pod install

원래는 pod install만해도 되는데 오류가 나는 경우

pod repo update를 해주거나 이것도 안되면

rm -rf ~/.cocoapods/repos/trunk/

 

 

그러면 이제 ios 폴더 내에 podfile.lock이 생성되는 모습을 볼 수 있다.

이제 react-native run-ios를 다시해보면 

이렇게 뜨면 성공이다... ㅠ

 

M1은 과도기라서 안되는게 많다 

일단 오류가 나면 구글링을 (무조건 영어로..) 뒤에 for m1 / silicon mac을 붙여서 검색해보는 것을 추천

 

 

M1용 안드로이드 에뮬레이터 설치방법은 여기를 참고하시면 됩니다!

2021/02/08 - [WEB_APP/React-Native] - [Silicon Mac M1] 안드로이드 에뮬레이터(Android Emulator)설치

[Silicon Mac M1] 안드로이드 에뮬레이터(Android Emulator)설치