SDK do cliente React Native
Importante
O Visual Studio App Center está programado para ser desativado em 31 de março de 2025. Embora você possa continuar a usar o Visual Studio App Center até que ele seja totalmente desativado, há várias alternativas recomendadas para as quais você pode considerar migrar.
Esse plug-in fornece integração do lado do cliente para o serviço CodePush, permitindo que você adicione facilmente uma experiência de atualização dinâmica aos seus aplicativos React Native.
Como funciona?
Os aplicativos React Native são compostos de arquivos JavaScript e quaisquer imagens associadas, que são agrupadas pelo empacotador e distribuídas como parte de um binário específico da plataforma (um .ipa
arquivo ou.apk
). Quando o aplicativo é lançado, a atualização do código JavaScript (por exemplo, fazer correções de bugs, adicionar novos recursos) ou ativos de imagem exige que você recompile e redistribua todo o binário, o que inclui qualquer tempo de revisão para as lojas nas quais você está publicando.
O plug-in do CodePush ajuda a exibir melhorias do produto instantaneamente para os usuários finais, mantendo o JavaScript e as imagens sincronizados com as atualizações lançadas no servidor do CodePush. Dessa forma, seu aplicativo obtém os benefícios de uma experiência móvel offline, bem como a agilidade "semelhante à Web" de atualizações de sideload assim que elas estão disponíveis.
Para garantir que os usuários finais sempre tenham uma versão funcional do seu aplicativo, o plug-in do CodePush mantém uma cópia da atualização anterior, para que, caso você acidentalmente envie uma atualização que inclua uma falha, ela possa reverter automaticamente. Dessa forma, você pode ter certeza de que sua nova agilidade de lançamento não resultará no bloqueio de usuários antes que você tenha a chance de reverter no servidor.
Observação
Quaisquer alterações de produto que afetem o código nativo (por exemplo, modificar seu arquivo MainActivity.java AppDelegate.m/, adicionar um novo plug-in) não podem ser distribuídas via CodePush e, portanto, devem ser atualizadas por meio da(s) loja(s) apropriada(s).
Plataformas React Native suportadas
- iOS (7+)
- Andróide (5.0+)
- Windows (UWP)
Tentamos o nosso melhor para manter a compatibilidade com versões anteriores do React Native, mas devido à natureza da plataforma e à existência de alterações significativas entre as versões, é possível que você precise usar uma versão específica do plug-in CodePush para dar suporte à versão exata do React Native que você está usando. A tabela a seguir descreve quais versões do plug-in do CodePush oferecem suporte oficial às respectivas versões do React Native:
Versões do React Native | Suporte a versões do CodePush |
---|---|
<0.14 | Sem suporte |
v0.14 | v1.3 (introduziu o suporte ao Android) |
v0.15-v0.18 | v1.4-v1.6 (introduziu o suporte a ativos do iOS) |
v0.19-v0.28 | v1.7-v1.17 (introduziu o suporte a ativos do Android) |
v0.29-v0.30 | v1.13-v1.17 (código de hospedagem nativo refatorado RN) |
v0.31-v0.33 | v1.14.6-v1.17 (código de hospedagem nativa refatorado RN) |
v0.34-v0.35 | v1.15-v1.17 (código de hospedagem nativo refatorado RN) |
v0.36-v0.39 | v1.16-v1.17 (manipulador de currículo refatorado RN) |
v0.40-v0.42 | v1.17 (arquivos de cabeçalho do iOS refatorados pelo RN) |
v0.43-v0.44 | v2.0+ (dependências do uimanager refatoradas pelo RN) |
v0.45 | v3.0+ (código do gerenciador de instâncias refatorado RN) |
v0.46 | v4.0+ (código do carregador de pacote js refatorado RN) |
v0.46-v0.53 | v5.1+ (RN removido registro não utilizado de módulos JS) |
v0.54-v0.55 | v5.3+ (integração com o Plug-in do Android para Gradle 3.x) |
v0.56-v0.58 | v5.4+ (versões atualizadas do RN para ferramentas Android) |
v0.59 | v5.6+ (código do carregador de pacote js refatorado RN) |
v0.60-v0.61 | v6.0+ (RN migrado para Autolinking) |
Trabalhamos duro para responder a novos lançamentos do React Native, mas eles ocasionalmente nos quebram. Atualizaremos este gráfico com cada versão do React Native, para que os usuários possam verificar qual é o nosso suporte oficial.
Componentes suportados
Ao usar o sistema de ativos do React Native (como usar a sintaxe), a lista a seguir representa o conjunto de componentes principais (e props) que oferecem suporte à atualização de suas imagens e vídeos referenciados por meio do require("./foo.png")
CodePush:
Componente | Adereço(s) |
---|---|
Image |
source |
MapView.Marker (Requer react-native-maps >=O.3.2 ) |
image |
ProgressViewIOS |
progressImage , trackImage |
TabBarIOS.Item |
icon , selectedIcon |
ToolbarAndroid (React Native 0.21.0+) |
actions[].icon , logo , overflowIcon |
Video |
source |
A lista a seguir representa o conjunto de componentes (e props) que atualmente não dão suporte à atualização de seus ativos por meio do CodePush, devido à sua dependência de imagens e vídeos estáticos (como usar a { uri: "foo" }
sintaxe):
Componente | Adereço(s) |
---|---|
SliderIOS |
maximumTrackImage , minimumTrackImage , thumbImage , trackImage |
Video |
source |
Atualizaremos essa lista à medida que novos componentes principais forem lançados, que dão suporte a ativos de referência, para garantir que os usuários saibam exatamente o que podem esperar atualizar usando o CodePush.
Observação
O CodePush só funciona com componentes de vídeo ao usar require
na propriedade de origem. Por exemplo:
<Video source={require("./foo.mp4")} />
Conformidade com as diretrizes da loja
Embora o Google Play e os aplicativos distribuídos internamente (por exemplo, Enterprise, Fabric, App Center) não tenham limitações sobre como publicar atualizações usando o CodePush, a iOS App Store e suas diretrizes correspondentes têm regras mais precisas que você deve conhecer antes de integrar a solução em seu aplicativo.
O Contrato de Licença do Programa de Desenvolvedor da Apple, sob o parágrafo 3.3.2, permitia totalmente atualizações over-the-air de JavaScript e ativos - e em sua versão mais recente (20210607) disponível para download aqui , esta decisão é ainda mais ampla:
O código interpretado pode ser baixado para um Aplicativo, mas apenas desde que tal código: (a) não altere a finalidade principal do Aplicativo, fornecendo recursos ou funcionalidades que sejam inconsistentes com a finalidade pretendida e anunciada do Aplicativo conforme enviado à App Store, (b) não crie uma loja ou vitrine para outros códigos ou aplicativos, e (c) não ignora a assinatura, a sandbox ou outros recursos de segurança do sistema operacional.
O CodePush permite que você siga essas regras em total conformidade, desde que a atualização enviada não desvie significativamente seu produto de sua intenção original aprovada pela App Store.
Para permanecer em conformidade com as diretrizes da Apple, sugerimos que os aplicativos distribuídos pela App Store não habilitem a updateDialog
opção ao chamar sync
, já que nas Diretrizes de revisão da App Store está escrito que:
Os apps não podem forçar os usuários a classificar o app, revisá-lo, fazer o download de outros apps ou outras ações semelhantes para acessar a funcionalidade, o conteúdo ou o uso do app.
Este não é necessariamente o caso de updateDialog
, uma vez que não forçará o usuário a baixar a nova versão, mas pelo menos você deve estar ciente dessa regra se decidir mostrá-la.
Exemplos de aplicativos / iniciantes
A comunidade React Native criou graciosamente alguns aplicativos de código aberto incríveis que podem servir de exemplo para desenvolvedores que estão começando. A lista a seguir é de aplicativos OSS React Native que também estão usando o CodePush e podem ser usados para ver como outras pessoas estão usando o serviço:
- F8 App - O aplicativo oficial da conferência para F8 2016.
- Feline for Product Hunt - Um cliente Android para Product Hunt.
- GeoEncoding - Um aplicativo da Lynx IT Digital, que demonstra como usar vários componentes e módulos do React Native.
- Math Facts - Um aplicativo da Khan Academy para ajudar a memorizar fatos matemáticos com mais facilidade.
Além disso, se você deseja começar a usar o React Native + CodePush e está procurando um kit inicial incrível, confira o seguinte:
-
Observação
Se você desenvolveu um aplicativo React Native usando CodePush, que é de código aberto, informe-nos. Adoraríamos adicioná-lo a esta lista!
Integração / Entrega Contínua
Além de usar a CodePush CLI para lançar atualizações "manualmente", acreditamos que é importante criar uma solução repetível e sustentável para fornecer atualizações continuamente ao seu aplicativo. Dessa forma, é simples o suficiente para você ou sua equipe criar e manter o ritmo das implantações ágeis. Para ajudar na configuração de um pipeline de CD baseado em CodePush, consulte as seguintes integrações com vários servidores de CI:
- Azure DevOps – O Azure DevOps (anteriormente conhecido como VSTS) também tem extensões para publicação no App Center e na Google Play Store, portanto, ele fornece uma ótima solução de CD móvel em geral.
- Travis CI
Consumo de TypeScript
Este módulo envia seu *.d.ts
arquivo como parte de seu pacote NPM, que permite que você o faça import
e receba intellisense em editores de suporte (como Visual Studio Code), bem como verificação de tipo em tempo de compilação se você estiver usando TypeScript. Na maioria das vezes, esse comportamento deve funcionar imediatamente, no entanto, se você especificou es6
como o valor para a target
opção do compilador ou module
em seu tsconfig.json
arquivo, certifique-se de definir a opção como moduleResolution
node
. Isso garante que o compilador TypeScript procure dentro do node_modules
as definições de tipo dos módulos importados. Caso contrário, você receberá um erro como o seguinte ao tentar importar o react-native-code-push
módulo: error TS2307: Cannot find module 'react-native-code-push'
.