React JS应用接入Firebase 9遇模块错误，求账号认证解决方案

这个错误是因为你使用的是Firebase v9或更高版本，该版本采用了模块化API设计，不再支持import firebase from "firebase"这种默认导入方式，必须使用指定的子模块导入。

解决方案一：使用Firebase v9+模块化导入（推荐） #

修改你的firebase.js代码，改用模块化导入方式：

// 导入所需的Firebase模块
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import { getAuth } from "firebase/auth";

const firebaseConfig = {
  apiKey: "AIzaSyAXdZmTDJjxY1cxn2QkNaqh2FzbGDPjds8",
  authDomain: "roum-34c72.firebaseapp.com",
  projectId: "roum-34c72",
  storageBucket: "roum-34c72.appspot.com",
  messagingSenderId: "509648148482",
  appId: "1:509648148482:web:6d66ae1678c1ddfd3baf1b",
  measurementId: "G-Z9EK18CBH0",
};

// 初始化Firebase应用
const firebaseApp = initializeApp(firebaseConfig);

// 获取Firestore和Auth实例
const db = getFirestore(firebaseApp);
const auth = getAuth(firebaseApp);

export { db, auth };

你的login.js代码无需修改，导入auth的方式保持兼容。

解决方案二：降级到Firebase v8版本（临时快速解决） #

如果暂时不想调整代码结构，可以卸载当前版本，安装v8稳定版：

npm uninstall firebase
npm install firebase@8.10.0

降级后原有的firebase.js代码即可正常运行。

注：推荐使用方案一，Firebase官方已停止对v8版本的新功能更新，模块化导入能有效优化打包体积，符合现代前端工程实践。

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