Mobile

Mettre à jour React Native de 0.76 à 0.78 : étapes et corrections

Mettre à jour une application React Native de 0.76 à 0.78 en deux étapes : le changement d'AppDelegate de 0.77, Android 15, les journaux Metro, React 19 et le piège de defaultProps.

Hamza El Haissouf

5 min de lectureMis à jour le 25 octobre 2026FR

J'ai mis à jour une application React Native en production de 0.76 à 0.78. Voici le chemin qui a fonctionné, les erreurs rencontrées et la façon dont je les ai corrigées, vérifiés à partir des notes de version officielles de 0.77 et 0.78.

Mettre à jour en deux étapes, pas en une

Passer directement de 0.76 à 0.78 mélange deux séries de changements et rend chaque erreur plus difficile à retracer. Procédez en deux étapes, chacune sur sa propre branche, et faites compiler et tourner l'application entre les deux :

0.76 → 0.77 : changements des modèles natifs sur iOS et Android.
0.77 → 0.78 : React 19.

Pour chaque étape, ouvrez le React Native Upgrade Helper avec vos versions exactes et appliquez le diff fichier par fichier. Mettez à jour une bibliothèque à la fois : jamais React Native et votre bibliothèque de navigation dans le même commit.

Étape 1 : 0.76 → 0.77

iOS : ajouter le fournisseur de dépendances

0.77 change la façon dont l'application charge les dépendances natives tierces. Le modèle reçoit un nouvel import et une nouvelle ligne dans AppDelegate.mm :

#import <ReactAppDependencyProvider/RCTAppDependencyProvider.h>

// dans application:didFinishLaunchingWithOptions:
self.dependencyProvider = [RCTAppDependencyProvider new];

Si la ligne manque, l'application peut compiler puis échouer à l'exécution. Le nouveau modèle est écrit en Swift (AppDelegate.swift), mais vous n'êtes pas obligé de changer : la version Objective-C++ reste prise en charge, à condition de contenir cette ligne.

L'erreur que j'ai rencontrée :

No visible @interface for 'RCTAppDelegate' declares the selector 'dependencyProvider'

Elle signifie que la ligne est bien dans votre AppDelegate, mais que Xcode compile encore avec les en-têtes de 0.76, où la propriété n'existe pas. Vérifiez que react-native est en 0.77 dans package.json, réinstallez les pods et nettoyez le build :

cd ios
rm -rf Pods Podfile.lock build
pod install --repo-update

Gardez la ligne. La supprimer fait disparaître l'erreur, mais casse les modules tiers à l'exécution.

iOS : CocoaPods n'arrive pas à télécharger cmake

[!] CDN: trunk URL couldn't be downloaded: cmake

Celle-ci est un problème du CDN de CocoaPods, pas de React Native. Videz le cache et réessayez :

cd ios
pod deintegrate
pod cache clean --all
rm -rf Pods Podfile.lock
pod install --repo-update

Android : Kotlin 2, Android 15 et pages de 16 Ko

0.77 compile avec Kotlin 2.0.21. Les modules natifs écrits en Kotlin peuvent nécessiter une mise à jour.
Avec targetSdk 35, Android 15 impose l'affichage bord à bord (edge-to-edge) : le contenu peut passer sous la barre d'état et la barre de navigation. react-native-safe-area-context gère les marges, mais vérifiez chaque écran.
0.77 ajoute la prise en charge des pages mémoire de 16 Ko, que Google Play exige pour les nouvelles applications et les mises à jour ciblant Android 15 ou plus. Je l'ai traité dans un guide dédié aux pages de 16 Ko.

Outillage : deux choses qui disparaissent

npx react-native init n'existe plus. Les nouveaux projets utilisent npx @react-native-community/cli init ou un framework comme Expo.
Metro n'affiche plus console.log dans le terminal. Utilisez le panneau Console de React Native DevTools. À partir de 0.77.1 et 0.78, vous pouvez rétablir les journaux dans le terminal avec npx @react-native-community/cli start --client-logs, mais cette option est temporaire.

Étape 2 : 0.77 → 0.78 et React 19

0.78 apporte React 19. L'essentiel du travail se fait dans votre JavaScript, pas dans le code natif.

`propTypes` et `defaultProps`

React 19 supprime les vérifications propTypes : elles sont ignorées sans avertissement. Rien ne plante, mais vous perdez ces avertissements ; déplacez donc ces vérifications vers TypeScript.

Le changement qui casse réellement des écrans, ce sont les defaultProps sur les composants fonctionnels, que React 19 n'applique plus. Un composant qui en dépendait reçoit désormais undefined. Cherchez-les dans votre code et dans vos bibliothèques, et utilisez des paramètres par défaut à la place :

// Avant
function Badge({ label }) { /* ... */ }
Badge.defaultProps = { label: "New" };

// Après
function Badge({ label = "New" }) { /* ... */ }

Pour une bibliothèque qui définit encore defaultProps sur un composant fonctionnel, cherchez d'abord une version à jour, et ne la corrigez avec patch-package que s'il n'en existe pas.

Refs et `forwardRef`

Les composants fonctionnels peuvent désormais recevoir ref comme une prop ordinaire : le nouveau code n'a plus besoin de forwardRef. Le code existant avec forwardRef continue de fonctionner : ne le réécrivez pas pendant la mise à jour.

Facultatif : React Compiler et drawables XML

Le React Compiler ne demande plus qu'un paquet et un plugin Babel. Les composants qu'il optimise affichent un badge Memo dans React Native DevTools. Essayez-le une fois la mise à jour stabilisée, pas pendant.
Sur Android, le composant Image peut charger les drawables XML (vecteurs et formes) que vous importez. Ils ont besoin d'une largeur et d'une hauteur explicites, et react-native-svg reste l'option multiplateforme.

Tester avant de fusionner

L'application démarre sur iOS et Android, en build debug et release
Navigation, liens profonds et bouton retour d'Android
Notifications push reçues et ouvertes
Chaque module natif utilisé (caméra, cartes, paiements…)
Écrans sous la barre d'état sur Android 15 (bord à bord)
Hermes activé
Build release signé installé sur un vrai appareil
Tests de bout en bout, si vous en avez

Testez sur de vrais appareils : les simulateurs masquent les problèmes de mémoire, de caméra et de clavier.

Aller au-delà de 0.78

La même méthode vaut pour toutes les versions suivantes : une version mineure à la fois, l'Upgrade Helper pour le diff, une bibliothèque à la fois, et un build fonctionnel entre chaque étape. Si votre application a plusieurs versions de retard ou est bloquée sur Google Play, c'est exactement ce que couvre mon offre Play-Ready Rescue.

Bloqué sur une mise à jour React Native ? Réservez un appel de 30 minutes ou découvrez mon service de développement React Native.