React+Firebase v9.16.0初始化报错：未创建DEFAULT应用

你的问题出在混用了Firebase v9的模块化API和Compat兼容模式：你用模块化的initializeApp初始化了App，但获取Storage和Firestore时却用了Compat模式的firebase.storage()、firebase.firestore()，导致Compat模式的默认App未被初始化，触发报错。

下面给两种可行的修复方案：

方案一：完全使用Compat兼容模式（适配v8写法） #

修改你的config.js，统一用Compat包和初始化方式：

// 只导入compat版本的核心包
import firebase from 'firebase/compat/app';
// 导入对应服务的compat版本
import 'firebase/compat/storage';
import 'firebase/compat/firestore';

// 你的Firebase配置（记得填充真实的配置值）
const firebaseConfig = {
  apiKey: "",
  authDomain: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: ""
};

// 用Compat模式初始化App
firebase.initializeApp(firebaseConfig);

// 获取Compat模式的服务实例
const projectStorage = firebase.storage();
const projectFirestore = firebase.firestore();

export { projectStorage, projectFirestore}

方案二：使用Firebase v9+推荐的模块化API（更轻量化） #

直接用模块化写法，避免Compat模式的冗余：

// 导入模块化的初始化函数和服务函数
import { initializeApp } from "firebase/app";
import { getStorage } from "firebase/storage";
import { getFirestore } from "firebase/firestore";

// 你的Firebase配置（记得填充真实的配置值）
const firebaseConfig = {
  apiKey: "",
  authDomain: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: ""
};

// 初始化App
const app = initializeApp(firebaseConfig);

// 获取模块化的服务实例
const projectStorage = getStorage(app);
const projectFirestore = getFirestore(app);

export { projectStorage, projectFirestore}

注意事项 #

• 务必把firebaseConfig里的空值替换成你自己项目的真实配置（在Firebase控制台获取）
• 不要同时混用模块化API和Compat模式，否则容易出现类似的初始化冲突问题

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