遵循Firebase文档开发时遇TypeError：无法读取'_initializationPromise'

错误原因 #

你的googleSignIn函数额外定义了auth参数，但调用该函数时并未传入Firebase Auth实例，导致函数内部的auth值为undefined，而signInWithRedirect必须接收有效的Auth实例才能正常执行，因此触发了这个类型错误。另外你已经从外部导入了合法的auth实例，完全不需要将其作为参数传入函数。

修复后的代码 #

修改googleSignIn函数，移除多余的auth参数，直接使用导入的auth：

import { useContext, createContext, useEffect, useState } from "react";
import { GoogleAuthProvider, signOut, onAuthStateChanged, signInWithRedirect } from "firebase/auth";
import { auth } from '../firebase';

const AuthContext = createContext();

export const AuthContextProvider = ({ children }) => {
    const [user, setUser] = useState({});

    // 移除函数参数auth，直接使用导入的auth
    const googleSignIn = () => {
        const provider = new GoogleAuthProvider();
        return signInWithRedirect(auth, provider);
    } 

    const logOut = () => {
        signOut(auth);
    }

    useEffect(()=> {
        const unsubscribe = onAuthStateChanged(auth, (currentUser) => {
            setUser(currentUser);
            console.log('User', currentUser);
        });
        return () => unsubscribe();
    }, []);


    return (
        <AuthContext.Provider value={{ googleSignIn, logOut, user }}>
            {children} 
        </AuthContext.Provider>
    )
}

额外验证点 #

确保你的../firebase文件正确初始化了Firebase并导出了Auth实例，示例如下：

// firebase.js
import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";

// 替换为你的Firebase项目配置
const firebaseConfig = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_AUTH_DOMAIN",
  projectId: "YOUR_PROJECT_ID",
  storageBucket: "YOUR_STORAGE_BUCKET",
  messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
  appId: "YOUR_APP_ID"
};

const app = initializeApp(firebaseConfig);
export const auth = getAuth(app);

内容的提问来源于stack exchange，提问作者Tyler R