많은? 연습용 프로젝트를 생성해서 만들어도 맥에서 개발하는데도..안드로이드 시뮬레이터만 돌아간다. OTL.
이번에야 말로 IOS 시뮬을 켜보리라.. 해서 다시 정리하며 한땀한땀 고쳐보리라.
기본뼈대는 reactnative.dev 의 Setting up the development environment 를 토대로 하였으며, 각각의 버전확인 및 버전 변경방법 등도 다 적어둘 것이다. 두번다시 같은 삽질은 안할테다.
1. Development OS
Mac OS 13.2
2. 설치해야하는 것들
각각의 버전은 현재 내가 설치한 버전이고 의존성이 있어서 어느 Node 18버전을 설치한 사용자라면 나머지 버전을 똑같이 한다해도 에러가 나게 된다. 즉. 노드버전 16.x 를 비롯해 다른 것들도 모두 버전을 맞추는 것이 좋다. (어차피 안맞추면 에러남.)
Node ( v16.0.0)
node --version현재 node 최신버전은 19.x 이다. 하지만 호환성을 위해 16버전으로 재설치 하였다. 14버전도 괜찮은 듯하지만 맞춰서 픽스해야할것이 16버전보다는 더 많지 않을까하여 16 사용중이다.
Node, watchman brew 로 특정버전 설치 명령어
# 최신 버전으로 설치할 때
brew install node
# 특정 버전으로 설치할 때 (만약, 16버전으로 설치한다면 )
brew install node@16
brew install watchman설치하기 전에 이미 설치 되어있는지 꼭 확인해본다.
Watchman( 2023.01.23.00)
watchman --v일반적으로 watchman은 특정 폴더나 파일을 감시해서 변경시에 특정 동작을 하는 역할을 한다. react-native에서는 코드 수정시에 바로 적용될 수 있도록 도와준다.
XCode 13.2
(* 무심코 14버전으로 업데이트 눌렀다가 다시 13버전으로 내려왔다. ...다운그레이드 방법은 여기에 적어두었다.
the React Native command line interface
- Locations에 들어가서 Command Line Tools 에서 xcode xx.x 선택
Xcode 를 다운그레이드 혹은 처음 설치했다면 아래 화면에 있는 Command Line Tools 에 None 이 아닌 뭐라도 선택되어있어야 한다.
Xcode-preference->Locations
- Accounts에서 본인 계정 추가
- Components에서 최신 ios simulator 설치
NPM (7.10.0)
혹시 설마 NPM 버전 변경이 필요하다면 여기로
CocoaPods (1.11.3)
sudo gem install cocoapods이게 실패한다면 brew 로 설치해보자.
#필요하다면 이전 캐쉬 삭제 후 설치한다.
brew cleanup -d -v
# 설치
brew install cocoapods버전확인
pod --version
1.11.3a Ruby version manager (and Ruby ruby-2.7.6 )
pod의 버전이 깔끔하게 표시된다면 생략해도 무방.
brew update
# Ruby 버전관리 프로그램 (rbenv) 설치
brew install rbenv ruby-build
# 원하는 루비 버전 선택해서 설치 (예:3.0.3)
rbenv install 3.0.3
#만약 여러버전의 설치가 되어있다면 default 버전을 선택해줘야 한다.
rbenv global 2.7.5
# 설치된 루비 버전확인
rbenv versions
# PATH 지정
echo '# rbenv' >> ~/.zshrc
echo 'export PATH=~/.rbenv/bin:$PATH' >> ~/.zshrc
echo 'eval "$(rbenv init -)"' >> ~/.zshrc
source ~/.zshrc
#pod version 이 정상적으로 확인된다면,
#~/zshrc에 아래 내용 추가
#gem
export GEM_HOME=$HOME/.gem
export PATH=$GEM_HOME/bin:$PATH
3. 테스트용 프로젝트 생성
AwesomeProject라는 이름의 기본 프로젝트를 생성한다.
npx react-native init AwesomeProject
만약 이미 설치된 CLI가 있다면 아래 명령어로 지운후 재설치한다.
npm uninstall -g react-native-cli @react-native-community/cli
4. ios native 용 의존성 설치
{프로젝트폴더}/ios 에서 실행함에 유의한다.
cd ios
pod install
#만약 PodFile 이나 Pods 폴더 자체가 없다면(혹은 지웠다면)
cd ios
pod init
pod installpod install 하는데 문제가 생겼다면 아래 글도 참고.
5. 실행
npx react-native run-ios 또는 npm run ios 를 통해 프로젝트를 실행해본다. 두개의 명령어는 동일한 결과를 가져오니 아무거나 사용해도 된다.
꼭!
이렇게 기본 프로젝트가 잘 돌아가는것을 확인한 후, 만들고자하는 프로젝트를 생성해야한다.
6. Xcode 설정
'개발로그 > ReactNative' 카테고리의 다른 글
| 에러가 있는 코드로부터 배운다. React Native Animated 에서의 Value 수정하기(useRef) (0) | 2023.02.01 |
|---|---|
| React Native Animated - 애니메이션 value 를 수정하기 위해 사용하는 것들. 예제 포함 (0) | 2023.01.31 |
| react native Animated 를 사용할때 알아야할 절대 Rules! (0) | 2023.01.31 |
| 처음부터 다시 해보는 npx create-react-native-app dear-diary with ios 세팅! 나만의 프리셋 (0) | 2023.01.31 |
| **BUILD FAILD** xcode_env_generator 를 생성시키는 버전으로 expo-modules-autolinking 의 버전을 맞춰보자. (0) | 2023.01.29 |
| React Query 에서 모든 캐쉬된 쿼리에 권한을 갖는 QueryClient 사용법 그리고 개념정리 (0) | 2023.01.27 |
| CRNA로 만들어진 사이드프로젝트 Netflify 앱- Movies 화면 스냅샷 (0) | 2023.01.26 |
| React Query 중요한 개념 : 캐싱과 쿼리 키 (0) | 2023.01.26 |
댓글