Compilando um projeto React-Native no Mac OS

Instalando as dependências (bibliotecas) do projeto

Antes de compilar e executar, os 2 passos abaixo devem SEMPRE ser executados.

  1. No diretório cli/mobile do projeto executar o comando abaixo

    yarn
    
  2. No diretório cli/mobile/ios/ do projeto executar o comando abaixo

    pod install
    

Compilando o projeto e executando no simulador

Existem 2 formas de compilar e executar o simulador: pelo próprio yarn, ou pelo XCode.

Pelo yarn, parece mais simples, porém, em caso de erro é recomendável que se teste compilar e executar pelo XCode pois a saída de erros do yarn não é muito amigável. A saída de erros do XCode, entretanto, te possibilita verificar qual o motivo do erro qe está ocorrendo.

Compilando pelo yarn

No diretório cli/mobile/ do projeto executar um dos comandos abaixo

react-native run-ios
yarn ios 

Para escolher a configuração (debug/release), ou para escolher o simulador/dispositivo onde o app deve ser executado, passar os parâmetros conforme exemplos abaixo:

yarn ios --simulator "iPhone 7" --configuration Debug
yarn ios --device "iPhone de Erika" --configuration Release

Qualquer um desses comandos já fará a compilação e a inicialização do simulador. O yarn utilizar a linha de comando do Xcode (Xcode Command Line Tools) para compilar a aplicação, e já inicializa o simulador com a aplicação rodando.

Compilando pelo XCode

  1. No diretório cli/mobile/ios, Abrir o projeto .xcworkspace no XCode

  2. Na aba superior, escolher o simulador onde deseja-se executar a aplicação conforme imagem abaixo. Se a intenção for somente compilar, pule essa etapa.

  3. Para apenas compilar, selecione o menu Product e depois Build, conforme imagem abaixo.

  4. Para compilar e já iniciar o simulador, selecione o menu Product e depois Run, OU apenas clique no botão de "play" no menu superior, conforme imagens abaixo.

Limpando o cache do Xcode

Às vezes a compilação falha sem motivo. Isso ocorre com certa frequência no react-native, especialmente quando uma versão diferente do mesmo app foi compilada anteriormente.

O Xcode armazena dados compilados (chamados de DerivedData) em um local temporário para diminuir o tempo de recompilação. Porém, no react-native isso costuma trazer problemas, então é recomendável, ao ter erro de compilação, tentar limpar esses dados.

Os comandos para limpar dados temporários do XCode são esses abaixo:

killall Xcode
xcrun -k
xcodebuild -alltargets clean
xcrun simctl delete unavailable
rm -Rf "$(getconf DARWIN_USER_CACHE_DIR)/org.llvm.clang/ModuleCache"
rm -Rf "$(getconf DARWIN_USER_CACHE_DIR)/org.llvm.clang.$(whoami)/ModuleCache"
rm -Rf ~/Library/Developer/Xcode/DerivedData/
rm -Rf ~/Library/Developer/Xcode/iOS\ Device\ Logs/