React Native中调用firebase.auth()报Cannot read property 'auth' of undefined错误

你项目安装的是Firebase v9.1.2，这是模块化重构后的版本，不兼容v8及更早版本的全局命名空间调用语法。你使用的firebase.auth()是旧版本的写法，没有按照v9的规范正确导入、初始化Firebase实例，因此调用时会读取到undefined的firebase对象，抛出该类型错误。

方案1：使用v9模块化API（官方推荐） #

这是官方推荐的写法，体积更小、tree-shaking支持更好：

• 首先创建Firebase配置文件（示例为firebase.js），完成初始化：

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

// 替换为你自己的Firebase项目配置参数
const firebaseConfig = {
  apiKey: "你的项目apiKey",
  authDomain: "你的项目authDomain",
  projectId: "你的项目projectId",
  storageBucket: "你的项目storageBucket",
  messagingSenderId: "你的项目messagingSenderId",
  appId: "你的项目appId"
};

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

export { auth };

• 在需要监听登录状态的业务文件中导入对应方法使用：

import { auth } from "./firebase.js"; // 替换为你实际的配置文件路径
import { onAuthStateChanged } from "firebase/auth";

onAuthStateChanged(auth, (user) => {
  if (user) {
    // 用户已登录的业务逻辑
  } else {
    // 用户未登录的业务逻辑
  }
});

方案2：使用v9兼容层（适合快速复用旧代码） #

如果不想改动大量旧版本语法的代码，可以使用v9提供的兼容包：

• 配置文件写法如下：

import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';

const firebaseConfig = {
  // 替换为你自己的项目配置
};

firebase.initializeApp(firebaseConfig);
export default firebase;

• 原有firebase.auth().onAuthStateChanged((user) => {})的写法无需修改即可正常运行。

备选方案：降级到Firebase v8 #

如果暂时不想适配v9，可以直接降级到最后一个稳定的v8版本：

npm install firebase@8.10.0
# 或使用yarn
yarn add firebase@8.10.0

降级完成后原有旧写法即可直接运行，不推荐长期使用该方案，v8版本已经停止官方维护。

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