# ATUALIZANDO REACT-NATIVE - Android :up: :nerd_face: > Mantenha Este documento Sempre Atualizado :+1: > :information_source: **É Importante criar uma branch separada para realizar as atualizacoes, e para cada etapa a ser implementada, criar uma nova branch a partir dessa branch principal de atualizacao.** ## 1. Preparando Ambiente para SDK 29 :alien: ### Atualize a IDE Android Studio para a Versao mais recente ### Baixe o SDK 29(Android 10) >Siga o guia de configuração do reactnative.dev https://reactnative.dev/docs/environment-setup > ### Baixe o NDK compativel a versao do gradlew >[Link para guia de instalacao NDK](https://developer.android.com/studio/projects/configure-agp-ndk?language=agp4-1) (**Escolha a versao compativel com a do gradlew no projeto**) >ex: ![](https://i.imgur.com/uH4WEx6.png) >**Tabela comparativa Gradlew x NDK version** > ![](https://i.imgur.com/H7tswMl.png) ## 2. Siga o tutorial de UPGRADE React-Native Mais recente > Prefira atualizar com o [Upgrade-Helper](https://reactnative.dev/docs/upgrading#upgrade-helper) :helmet_with_white_cross: ## 3. Identificando Conflitos ### 3.1. Identificando Conflitos via Android Studio :smiley: > A melhor maneira de resolver conflitos eou testar se seu app esta pronto para uso é pelo android studio > ferramenta de build. 1. Abra a pasta android do seu projeto no android studio: ![](https://i.imgur.com/1RlF9z4.png) 2. Build seu app 2.1. Basta clicar no martelo ![](https://i.imgur.com/0xeAEQi.png) 2.2. Verifique os logs de build ![](https://i.imgur.com/LjiAQo6.png) ![](https://i.imgur.com/NwrGaYj.png) 2.3. Seu app estiver pronto, o log de build retornara a menssagem **"BUILD SUCCESSFUL"**, como mostrado na imagem a cima; 2.4. **Em caso de Falha, o log de build emitira uma menssagem na cor vermelha identificando o problema.** :rotating_light: > :information_source: Resolva os conflitos do topo, eles geralmente corrigem os problemas que se seguem após ele. ### 3.2. Identificando Conflitos via Terminal :skull: 1. Entre na pasta android `cd android` 2. Limpe o cache do android `./gradlew clean` 3. Compile o app `./gralew build` 4. Resolva os conflitos: 4.1. Resolva os conflitos que aparecem no topo da lista, pois consequentemente, eles podem corrigir os demais erros que se seguem. > Geralmente o gradle informa o motivo do problema, veja o sublinhado da imagem a seguir. ![](https://i.imgur.com/ABL6o3q.png) > E também pode mostrar como resolver o problema. Nesse caso ele informa um link para a ressolucao do problema em (exemplo): https://developer.android.com/studio/build/dependencies#duplicate_classes ![](https://i.imgur.com/fTR3zwM.png) ## 4. Resolucoes de Conflitos e Upgrade em dependencias Linkadas >Como o react usa auto link a partir da versão 0.60, as dependencias linkadas precisam ser removidas e atualizadas(upgrade). ### 4.1. Como fazer Upgrade e Resolver conflitos de dependencias linkadas / dependencias Javascript. (Regras Gerais) Normalmente voce so precisa remover a dependencia nativa usando yarn, e instala de novo. Assim, o react fara o auto link, e sua dependencia estará atualizada. > Prefira pesquisar no google como fazer UPGRADE de tal dependencia, pois algumas dependencias como FireBase precisam de um tratamento extra. 1. Acesse o arquivo `android\app\src\main\java\com\postarhostwebsecrelnet\MainApplication.java` 2. Verifique as dependencias linkadas 3. Remova a dependendia usando `yarn remove <nomeDaDependencia>` 4. Em seguida, procure por todo o codigo android pelo `<nomeDaDependencia>` e delete as linhas que fazem referencia a essa dependencia. 5. Depois pesquise como instalar a nova versao da sua dependencia, e instale usando `yarn add` 6. Delete o diretorio `./nodemodules` 7. Delete os arquivo `package-lock.json` e `yarn.lock` 8. Instale tudo novamente usando `yarn install` 9. Acesso o diretorio android `cd android `e execute: 9.1. `./gradlew clean`- para limpar o cache do android 9.2. `./gradlew build` - para compilar: > caso o upgrade tenha sido feito com sucesso voce que seu build teve sucesso; caso haja erro, [indentifique e corrija o problema](#Resolvendo-Conflitos) e repita o processo a partir do passo 6. ### 4.2.Conflito NDK Correspondente nao encontrado >Instale o NDK para Gradle correspondente. Veja em: [Instalar uma versão específica do NDK](https://developer.android.com/studio/projects/install-ndk#specific-version) ### 4.3. Resolvendo conflito / Upgrading FireBase :fire: veja em : https://rnfirebase.io/migrating-to-v6 > Para atualizar o Firebase Notifications veja em [migrating-to-v6#notifications](https://rnfirebase.io/migrating-to-v6#notifications) (durante a atualização dê preferencia a usar o biblioteca https://wix.github.io/react-native-notifications/docs/getting-started ) #### 4.3.1. Resolvendo conflito de Kotlin ao instalar dependenia Firebase react-native-notifications > Ao tentar buildar o app apos a instalacao do react-native-notifications, voce receberá o log de erro: > ![](https://i.imgur.com/d3iCikZ.png) 1. Tools > Kotlin > Configure o Kotlin in project: ![](https://i.imgur.com/W7YI84T.png) ### 4.4. Resolvendo conflito / Upgrading React Navigation :atom_symbol: 1. Use `yarn remove` para remover a dependencia do 'react-navigation' no package.json 2. Instale a versao mais recente do [react-navigation](https://reactnavigation.org/) 3. Reescreva a navegação do app para adequar a versão mais recente do [react-navigation](https://reactnavigation.org/) ### 4.5. Erro no componente ListView `deprecated-react-native-listview` ``[Thu Feb 25 2021 14:31:45.646] ERROR Invariant Violation: ListView has been removed from React Native. See https://fb.me/nolistview for more information or use 'deprecated-react-native-listview'.`` ![](https://i.imgur.com/iCJm67p.png) > Erro do Tipo Javascript. Para identificar quan dependencia esta usando esse componente depreciado ListView 1. No terminal inicie uma instancia do vscode no diretorio node_modules; ![](https://i.imgur.com/m3XYMM3.png) 2. Aberto o diretorio node_modules no vs code, pesquise por 'ListView' e filtro 'files to include' = '.js' > Veja na imagem que foi encontrado uma importação deste componente, por uma outra dependencia, no caso,: `react-native-keyboar-aware-scroll-view` ![](https://i.imgur.com/FkNr7BB.png) 3. Atualize a dependencia que usa o componente 'ListView' para uma versão mais atual, para que uma versão que tenha a correção nela mesma.