Passer au SDK Web modulaire (v9)
Nous vous recommandons de migrer les applications qui utilisent actuellement le SDK Web 8 ou une version antérieure vers version 9 en suivant les instructions de ce guide.
Ce guide part du principe que vous connaissez la version 8 et que vous utiliserez un outil de regroupement de modules tel que webpack ou Rollup pour la mise à niveau et le développement continu de la version 9.
Nous vous recommandons vivement d'utiliser un bundler de module dans votre environnement de développement. Si vous n'en utilisez pas, vous ne pourrez pas profiter de la version 9 principale d'une taille d'application réduite. Vous aurez besoin de npm ou yarn pour installer le SDK.
À propos des bibliothèques de compatibilité
Deux types de bibliothèques sont disponibles pour la version 9 du SDK Web:
- Modular : nouvelle surface d'API conçue pour faciliter le tree-shaking (suppression du code inutilisé) afin de rendre votre application Web aussi petite et rapide que possible.
- Compat : surface d'API familière entièrement compatible avec la version 8, qui vous permet de passer à la version 9 sans modifier l'ensemble de votre code de SDK en une seule fois. Les bibliothèques Compat ont une taille faible ou inexistante, ou de performances par rapport à leurs homologues de la version 8.
Dans ce guide, nous partons du principe que vous allez exploiter la compatibilité bibliothèques pour faciliter la mise à niveau. Ces bibliothèques vous permettent de continuer en utilisant le code de la version 8 en même temps que le code refactorisé pour la version 9. Cela signifie que vous pouvez compiler et déboguer votre application plus facilement au cours du processus de mise à niveau.
Pour les applications dont l'exposition au SDK Web est très faible, il peut être utile refactoriser le code de la version 8 sans utiliser les bibliothèques de compatibilité de la version 9 ; Si vous utilisez la mise à niveau d'une telle application, vous pouvez suivre les instructions de ce guide pour "version 9 modulaire" sans utiliser les bibliothèques compat.
À propos du processus de mise à niveau
Un champ d'application est défini pour chaque étape du processus de mise à jour afin que vous puissiez terminer la modification source pour votre application, puis la compiler et l'exécuter sans interruption. En résumé, Pour mettre à jour une application, procédez comme suit:
- Ajoutez les bibliothèques de la version 9 et les bibliothèques de compatibilité à votre application.
- Mettez à jour les instructions d'importation de votre code pour qu'elles soient compatibles avec la version 9.
- Refactorisez le code pour le convertir en style modulaire.
- Supprimez la bibliothèque de compatibilité Authentication et le code de compatibilité pour Authentication afin de profiter de l'avantage de taille de l'application.
- Mise à jour du code d'initialisation vers le style modulaire
- Supprimez toutes les instructions de compatibilité de la version 9 et le code de compatibilité restants de votre application.
Obtenir la version 9 du SDK
Pour commencer, téléchargez les bibliothèques de la version 9 et les bibliothèques de compatibilité à l'aide de npm (dernière version : https://www.npmjs.com/package/firebase) :
npm i firebase@10.14.1
# OR
yarn add firebase@10.14.1
Mettre à jour les importations vers la compatibilité v9
Pour que votre code continue de fonctionner après la mise à niveau de votre dépendance de la version 8 à la version 9, modifiez vos instructions d'importation pour utiliser la version "compat" de chaque importation. Exemple :
Avant: version 8
import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';
Après : compatibilité avec la version 9
// v9 compat packages are API compatible with v8 code
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';
Refactoriser pour adopter un style modulaire
Alors que les API de la version 8 sont basées sur un espace de noms et un modèle de service en chaîne de points, l'approche modulaire de la version 9 signifie que votre code sera principalement organisé autour de fonctions. Dans la version 9, le package firebase/app et les autres packages ne renvoient pas une exportation complète contenant toutes les méthodes du package. Au lieu de cela, les packages exportent des fonctions individuelles.
Dans la version 9, les services sont transmis en tant que premier argument, et la fonction utilise ensuite les détails du service pour effectuer le reste.
Exemple : refactorisation d'une fonction d'authentification simple
Avant : compatibilité avec la version 9
Le code de compatibilité de la version 9 est identique à celui de la version 8, mais les importations ont changé. L'utilisation des bibliothèques compat pendant la mise à niveau vous permet de continuer en utilisant le code de la version 8 en même temps que le code refactorisé pour la version 9.
import firebase from "firebase/compat/app";
import "firebase/compat/auth";
const auth = firebase.auth();
auth.onAuthStateChanged(user => {
// Check for user status
});
Après: version 9 modulaire
La fonction getAuth utilise firebaseApp comme premier paramètre. La
La fonction onAuthStateChanged n'est pas enchaînée à l'instance d'authentification comme il le ferait
être en version 8 ; Il s'agit plutôt d'une fonction gratuite qui utilise auth comme première
.
import { getAuth, onAuthStateChanged } from "firebase/auth";
const auth = getAuth(firebaseApp);
onAuthStateChanged(auth, user => {
// Check for user status
});
Modifier le code d'initialisation
Mettez à jour le code d'initialisation de votre application pour qu'il utilise la nouvelle syntaxe modulaire de la version 9. Il est
important de mettre à jour ce code après avoir terminé de refactoriser tous les
dans votre application. cela est dû au fait que firebase.initializeApp() initialise
pour les API de compatibilité et modulaires, tandis que les API
La fonction initializeApp() n'initialise que l'état pour les modèles modulaires.
Avant: compatibilité version 9
import firebase from "firebase/compat/app"
firebase.initializeApp({ /* config */ });
Après: version 9 modulaire
import { initializeApp } from "firebase/app"
const firebaseApp = initializeApp({ /* config */ });
Supprimer le code de compatibilité
Pour profiter des avantages de taille du SDK modulaire de la version 9, vous devez éventuellement convertir toutes les invocations au style modulaire illustré ci-dessus et supprimer toutes les instructions import "firebase/compat/* de votre code. Lorsque vous avez terminé,
ne doit plus contenir de références à l'espace de noms global firebase.* ni à toute autre
dans le style du SDK version 8.
Avantages et limites de la version 9
La version 9 entièrement modularisée présente les avantages suivants par rapport aux versions antérieures:
- La version 9 permet de réduire considérablement la taille des applications. Il adopte le un format de module JavaScript moderne, ce qui permet pratiques en dans laquelle vous n'importez que les artefacts dont votre application a besoin. Selon votre application, la version 9 peut réduire de 80% la quantité de kilo-octets utilisée une application comparable créée avec la version 8.
- La version 9 continuera à bénéficier du développement continu de fonctionnalités, tandis que la version 8 sera figée à un moment ultérieur.