React Native集成Firebase遇Promise拒绝警告，无法获取数据求助

Hey there, let's work through this frustrating issue together. That error about _util.base64.tI being undefined is almost certainly tied to Firebase's internal dependencies or build cache problems—here's how to fix it:

Possible Causes & Solutions #

1. Check Firebase Dependency Version Compatibility #

This error often pops up when there's a version mismatch between Firebase packages (like firebase, @firebase/firestore, @firebase/util) or incompatibility with your React Native version.

• Open your package.json and make sure all Firebase-related packages are on the same major version (e.g., all 9.x or all 10.x). Mixing versions can break internal module references.
• If you're using a newer Firebase version, try downgrading to a stable release known to work with React Native (e.g., firebase@9.23.0). Run:

  npm install firebase@9.23.0 --save
  # or for yarn:
  yarn add firebase@9.23.0
  

2. Clear All Caches & Rebuild #

React Native and Xcode caches can hold onto corrupted or outdated module data. Let's wipe them clean:

• React Native cache:

  npx react-native start --reset-cache
  

• npm/yarn cache:

  npm cache clean --force
  # or
  yarn cache clean
  

• iOS build cache:
  1. Open Xcode, go to Product > Clean Build Folder
  2. Delete the DerivedData folder (default path: ~/Library/Developer/Xcode/DerivedData)
  3. Reinstall pods:

     cd ios && pod install && cd ..
     

3. Verify Firebase Initialization #

Make sure Firebase is properly initialized early in your app (e.g., in App.js or index.js). A partial or delayed initialization can cause internal modules like _util.base64 to fail loading.
Double-check your initialization code looks something like this:

import { initializeApp } from 'firebase/app';
import { getFirestore } from 'firebase/firestore';

const firebaseConfig = {
  // Your Firebase config here
};

const app = initializeApp(firebaseConfig);
export const db = getFirestore(app);

4. Rewrite the Firestore Call with Async/Await (Optional) #

While your original code looks correct, switching to async/await can sometimes surface clearer errors or resolve subtle Promise chain issues. Try updating your useEffect:

useEffect(() => {
  const fetchAppointments = async () => {
    try {
      const querySnapshot = await db.collection("Appointments")
        .orderBy("Timing", "desc")
        .limit(2)
        .get();
      
      const appointmentsList = querySnapshot.docs.map(doc => {
        const { Speciality, Date, TimeSlot } = doc.data();
        return { id: doc.id, Speciality, Date, TimeSlot };
      });

      setAppointments(appointmentsList);
    } catch (error) {
      alert(error.message);
      console.error("Fetch error:", error);
    }
  };

  fetchAppointments();
}, []);

Why Removing the Code Fixes the Issue (But Isn't a Solution) #

When you remove the Firestore fetch code, you're not triggering the internal Firebase modules that rely on _util.base64.tI. The error goes away simply because that code path never runs—but obviously, you lose access to your data. The real fix is resolving the dependency/cache issue causing the module to be undefined.

内容的提问来源于stack exchange，提问作者Amr Abdelhady