Jump to top
Edit Page

Migrating to v22

Migrate to React Native Firebase v22.

TypeScript »

Switching off warning logs

You may notice a lot of console warning logs as we deprecate the existing namespaced API. If you would like to switch these logs off, you may set the following global property to true anywhere before you initialize Firebase.

globalThis.RNFB_SILENCE_MODULAR_DEPRECATION_WARNINGS = true;

Enabling deprecation strict modes

You may enable a feature for the API migration which will throw a javascript error immediately when any namespaced API usage is detected.

This is useful to help you quickly locate any remaining usage of the deprecated namespace API via examination of the line numbers in the stack trace.

Note that there may be modular API implementation errors within the react-native-firebase modules, this may still be useful as a troubleshooting aid when collaborating with the maintainers to correct these errors.

globalThis.RNFB_MODULAR_DEPRECATION_STRICT_MODE === true;

Migrating to React Native modular API

If you are familiar with the Firebase JS SDK, the upgrade will be a familiar process, following similar steps to the migration guide for firebase-js-sdk.

React Native Firebase uses the same API as the official Firebase JS SDK modular API documentation so the same migration steps apply here, except there is no need for special "compat" imports as an intermediate step.

The process will always follow the same steps for every API you use:

  • determine the new modular API function for the old namespaced API you are using
  • import that new modular API function
  • change the call from using the firebase module to access the API and passing parameters, to the new style of using the modular API function, passing in the firebase module object(s) required for it to work and then the parameters.

In the end, it should be a very mechanical process and can be done incrementally, one API call at a time.

There are concrete examples below to show the process

Firestore Deprecation Example

Namespaced (deprecated) Query

You ought to move away from the following way of making Firestore queries. The React Native Firebase namespaced API is being completely removed in React Native Firebase v22:

import firestore from '@react-native-firebase/firestore';

const db = firestore();

const querySnapshot = await db.collection('cities').where('capital', '==', true).get();

querySnapshot.forEach(doc => {
  console.log(doc.id, ' => ', doc.data());
});

Modular Query

This is how the same query would look using the new, React Native Firebase modular API:

import { collection, query, where, getDocs, getFirestore } from '@react-native-firebase/firestore';

const db = getFirestore();

const q = query(collection(db, 'cities'), where('capital', '==', true));

const querySnapshot = await getDocs(q);

querySnapshot.forEach(doc => {
  console.log(doc.id, ' => ', doc.data());
});

For more examples of requesting Firestore data, see the official Firebase documentation for Get data with Cloud Firestore.

Migration Help

You will find code snippets for "Web namespaced API" and "Web modular API" throughout the official Firebase documentation. Update your code to use "Web modular API". Here are some links to help you get started: