Firebase导入报错：Package path . is not exported问题求助

问题说明 #

我编写了一段从Firebase读取数据的简单代码，但遇到模块导入错误，相关代码及报错信息如下：

Firebase.js 代码 #

import firebase from "firebase";

const firebaseConfig = {
    apiKey: <<API_KEY>>,
    authDomain: "fir-42683.firebaseapp.com",
    projectId: "fir-42683",
    storageBucket: "fir-42683.appspot.com",
    messagingSenderId: "950284829228",
    appId: "1:950284829228:web:f9e6862d17650cfca38789",
    measurementId: "G-VWT1P7ES8S"
};
 
export const db = firebase.initializeApp(firebaseConfig)

App.js 代码 #

import  {db }  from './Firebase'

报错信息 #

ERROR in ./src/Firebase.js 3:0-32 Module not found: Error: Package path . is not exported from package D:\BROCAMP\Week 15\olx\node_modules\firebase (see exports field in D:\BROCAMP\Week 15\olx\node_modules\firebase\package.json)

解决步骤 #

这个错误的核心原因是Firebase v9+采用了模块化架构，不再支持直接导入整个firebase包，需按以下方式修改：

方法一：使用Firebase v9+模块化语法（推荐） #

修改Firebase.js的导入和初始化逻辑，按需导入所需模块：

// 导入Firebase核心应用模块和Firestore模块（按需添加其他服务）
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";

const firebaseConfig = {
    apiKey: <<API_KEY>>,
    authDomain: "fir-42683.firebaseapp.com",
    projectId: "fir-42683",
    storageBucket: "fir-42683.appspot.com",
    messagingSenderId: "950284829228",
    appId: "1:950284829228:web:f9e6862d17650cfca38789",
    measurementId: "G-VWT1P7ES8S"
};

// 初始化Firebase应用
const app = initializeApp(firebaseConfig);
// 初始化并导出Firestore实例
export const db = getFirestore(app);

App.js的导入语句无需修改，保持原样即可。

方法二：兼容旧版命名空间语法（不推荐） #

如果想继续使用旧的导入方式，可以安装Firebase的compat兼容包：

1. 安装依赖：

npm install firebase@compat

2. 修改Firebase.js的导入：

import firebase from "firebase/compat/app";
import "firebase/compat/firestore"; // 按需导入对应服务的兼容版本

const firebaseConfig = { /* 你的配置 */ };

const app = firebase.initializeApp(firebaseConfig);
export const db = firebase.firestore(app);

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