Mobile Dev

Fix Firebase 'Component auth not registered yet' Error

Resolve 'Uncaught Error: Component auth has not been registered yet' in Firebase Auth for React Native/Expo. Use initializeAuth with AsyncStorage, Metro config fixes, and singleton patterns for reliable setup.

1 answer• 1 view

How to fix ‘Uncaught Error: Component auth has not been registered yet’ in Firebase? This error persists despite multiple attempts to resolve it.

Uncaught Error: Component auth has not been registered yet is a common firebase auth error in React Native/Expo projects caused by module-resolution/bundler issues or by initializing Auth before the native persistence is registered. The quickest fixes are to initialize Auth explicitly with initializeAuth + getReactNativePersistence(AsyncStorage), ensure a single (singleton) initialization, and, for Expo/Metro, add CJS support and disable package-exports resolution in metro.config.js.

Contents

Quick fix: initializeAuth (firebase auth error)

If your app uses the Firebase JS SDK in React Native / Expo, the most reliable immediate fix is to explicitly initialize Auth with the React Native persistence layer rather than relying on the web defaults. That means calling initializeAuth and passing getReactNativePersistence(AsyncStorage) instead of just getAuth().

Example (minimal):

js
// firebaseClient.js
import { initializeApp } from "firebase/app";
import { initializeAuth, getReactNativePersistence } from "firebase/auth";
import AsyncStorage from "@react-native-async-storage/async-storage";

const app = initializeApp(firebaseConfig);

const auth = initializeAuth(app, {
 persistence: getReactNativePersistence(AsyncStorage)
});

export { app, auth };

Why this helps: the RN environment needs a native-compatible persistence backend (AsyncStorage). initializeAuth registers the platform-specific pieces the JS SDK expects; if it’s not called, the runtime may throw “Component auth has not been registered yet”. See the explicit fix reported in the Firebase issue where specifying AsyncStorage resolved the initialization error: https://github.com/firebase/firebase-js-sdk/issues/8988.

Tips:

  • Import your firebaseClient.js only from your app root so initialization runs once.
  • Make sure @react-native-async-storage/async-storage is installed and the import matches your environment (Expo managed vs bare RN).
  • If you must support both web and RN builds, guard the RN code path (check Platform.OS or process.env) and fall back to getAuth() on web.

Metro / Expo bundler fix for “Component auth has not been registered yet”

Sometimes the error isn’t your code at all but how Metro resolves Firebase’s package exports. Newer Firebase releases use package exports and ESM builds that Metro can mis-resolve, which means the auth component isn’t the one Firebase expects. The common workaround is to add CommonJS support and disable package-exports resolution in Metro.

metro.config.js (Expo / Metro workaround):

js
const { getDefaultConfig } = require('expo/metro-config');

module.exports = (() => {
 const config = getDefaultConfig(__dirname);
 config.resolver.sourceExts.push('cjs');
 config.resolver.unstable_enablePackageExports = false;
 return config;
})();

After editing metro.config.js:

  • Stop the dev server and restart with cache cleared: expo start -c (or react-native start --reset-cache for bare RN).
  • Rebuild native binary if using a device test build.

This exact Metro tweak was shared and validated in Expo issues and a practical blog post showing the fix: https://github.com/expo/expo/issues/36588 and https://pratikpathak.com/component-auth-has-not-been-registered-yet/. It forces Metro to pick the CommonJS entry and bypass the package exports resolution that can mis-route Firebase internals.

Heads-up: disabling package exports is a workaround. Keep an eye on upstream fixes from Expo/Firebase and revert the toggle when compatibility is restored.

Singleton initialization and firebase auth (avoid re-init)

Another frequent root cause: multiple or out-of-order initializations of Auth. If you call initialization code from multiple modules (or import firebase/auth too early), you can create a race that triggers the “Component auth has not been registered yet” error.

Use a single, central initializer and export the same Auth instance everywhere. Example using a global guard:

js
import { initializeApp } from "firebase/app";
import { initializeAuth, getReactNativePersistence, getAuth } from "firebase/auth";
import AsyncStorage from "@react-native-async-storage/async-storage";

const app = initializeApp(firebaseConfig);

let auth;
if (!global.__firebaseAuthInitialized) {
 auth = initializeAuth(app, { persistence: getReactNativePersistence(AsyncStorage) });
 global.__firebaseAuth = auth;
 global.__firebaseAuthInitialized = true;
} else {
 auth = global.__firebaseAuth || getAuth(app);
}

export { app, auth };

Why a global or module-level singleton? It prevents re-initialization across hot reloads, code-splitting boundaries, or when different parts of your app import the SDK at slightly different times. The Expo issue thread that documents singleton solutions is here: https://github.com/expo/expo/issues/36496.

Also confirm you’re not mixing two Firebase implementations (the JS SDK and the native react-native-firebase package). Choose one approach—mixing them can cause registering conflicts.

Step-by-step troubleshooting checklist

Follow these steps in order; each is quick to try and narrows the fault:

  1. Confirm which Firebase package you use:
  • Run npm ls firebase and npm ls @react-native-firebase/app. If both appear, you might be mixing SDKs — remove one.
  1. Ensure AsyncStorage is installed:
  • npm install @react-native-async-storage/async-storage (or yarn add ...) and import it from the same path in your code.
  1. Switch to explicit RN initialization:
  • Replace plain getAuth() usage with initializeAuth(app, { persistence: getReactNativePersistence(AsyncStorage) }).
  1. Centralize initialization:
  • Put init code in one file and export the single auth instance (use the global guard pattern above).
  1. Fix Metro/Expo config if using Expo or Metro:
  1. Clear caches and reinstall:
  • rm -rf node_modules && npm install
  • expo start -c or react-native start --reset-cache and rebuild the app.
  1. Check for duplicate versions:
  • yarn why firebase or npm ls firebase — dedupe or lock versions in package.json if necessary.
  1. Toggle experimental RN features:
  • If you recently enabled the new architecture or made changes to Hermes, try reverting those to isolate the problem (some reports mention toggling new architecture helped).
  1. Try a repro in a minimal project:
  • Create a tiny RN/Expo app with only Firebase auth to see if the error reproduces. That isolates packaging vs app code causes.
  1. Search and follow related issues:
  • If none of the above works, file a focused issue with a minimal repro and include Metro config, Firebase version, Expo/React Native versions, and full logs. Useful trackers: Firebase JS SDK issues and Expo issues.

If you want commands for environment info: npx react-native info and expo diagnostics can speed up debugging.

Advanced debugging and alternatives

Still stuck? try these advanced steps.

A final note: when a fix works locally but fails after a cloud build (EAS, CI), remember to ensure your build caches are cleared — the Metro tweak must be present in the built bundle, not just in your dev server.

Sources

Conclusion

The “Component auth has not been registered yet” firebase error usually comes from bundler/module-resolution problems or from initializing Auth the wrong way in React Native. The fastest, most reliable fixes are explicit RN initialization with initializeAuth + getReactNativePersistence(AsyncStorage), enforcing a singleton Auth instance, and applying the Metro/Expo workaround (add ‘cjs’ and disable package exports) when needed. Follow the checklist above; if it still persists, gather a minimal repro and open an issue with the linked trackers so maintainers can patch the underlying compatibility problem.

Authors
NeuroAnswers
Author
Verified by moderation
NeuroAnswers
Moderation
Fix Firebase 'Component auth not registered yet' Error