You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

React应用Firebase Auth报错:Cannot assign to read only property '_canInitEmulator'

解决Firebase Auth报错:Cannot assign to read only property '_canInitEmulator' of object '#'

React应用中使用Firebase身份验证,此前运行正常,现在登录/注册时出现如下错误:

Cannot assign to read only property '_canInitEmulator' of object '#'

用户已确认auth对象已正确导出,相关代码如下:

相关代码

init.ts

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

const app = initializeApp({
 apiKey: "AIzaSyBRPIzl7N-_zScT55HiM7UovWWIXsmTkoQ",
 authDomain: "bakery-59d9c.firebaseapp.com",
 projectId: "bakery-59d9c",
 storageBucket: "bakery-59d9c.appspot.com",
 messagingSenderId: "48986447422",
 appId: "1:48986447422:web:0afd00e42ebc06ab883b6f",
});

export const auth = getAuth(app);
export const firestore = getFirestore(app);

auth.ts

import { auth } from "./init";
import {
  createUserWithEmailAndPassword,
  signOut,
  signInWithEmailAndPassword,
} from "firebase/auth";

export async function loginWithEmailAndPassword(
  email: string,
  password: string
) {
  try {
    const user = await signInWithEmailAndPassword(auth, email, password);
    return user;
  } catch (err: any) {
    throw new Error(err.message);
  }
} 

Login.tsx

async function login() {
   try {
      const loggedUser: any = await loginWithEmailAndPassword(email, password);
      setUser(loggedUser);
      toast.success("Logged in sucessfully", {
        position: "bottom-right",
      });
      navigate("/");
    } catch (err: any) {
      toast.error(err.message, {
        position: "bottom-right",
      });

      console.log(err.message)
    }
}

解决方案

  • 统一Firebase模块版本:检查package.json中所有firebase/*相关依赖的版本是否完全一致。比如firebase/app、firebase/auth、firebase/firestore必须使用相同版本号,版本不匹配是触发该错误的常见原因。
  • 清理依赖缓存并重新安装:删除项目根目录下的node_modules文件夹、package-lock.json(或yarn.lock),然后执行npm install(或yarn install)重新安装依赖,解决可能的依赖冲突问题。
  • 避免重复初始化Auth实例:确保整个应用中只调用一次getAuth(app),并通过单例方式导出(你的init.ts已经符合这个要求,检查其他代码文件是否有重复创建Auth实例的情况)。
  • 检查Emulator配置(如果使用):如果你的项目配置了Firebase Emulator,确保没有在Auth实例初始化后重复设置模拟器相关属性,避免修改只读属性_canInitEmulator。

内容的提问来源于stack exchange,提问作者Flavio Pinnelli

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.27 19:43:01