Firebase V9: 在我的 Firebase 加载器中未找到 'default' 导出

Question

我正在开发一个使用 Firebase (^9.6.7) 的 React 项目，当我配置 Firebase 数据库时出现以下错误：

编译出现问题：ERROR in ./src/App.js 28:4-17

'./firebase' 中没有找到 'default'（作为 'db' 导入的）（可能的导出项：auth、db、storage）

// in firebase.js 
// v9 compat packages are API compatible with v8 code
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';
    
const firebaseApp = firebase.initialzeApp({
  apiKey: "AIzaSyCAxk5u3dc69u-OeGuQfR8IZYoj3dr1Kxo",
  authDomain: "myinstagram-clone-fb535.firebaseapp.com",
  projectId: "myinstagram-clone-fb535",
  storageBucket: "myinstagram-clone-fb535.appspot.com",
  messagingSenderId: "1061340472237",
  appId: "1:1061340472237:web:d0b42559484d699a85b724",
  measurementId: "G-9H2TSBPRSK"
});
      
const db = firebaseApp.firestore();
const auth = firebase.auth();
const storage = firebase.storage();
export { db, auth, storage }

// in app.js
import db from './firebase' // <- error here

- Golam rabbani Rocky

---

如果您要使用 firebaseApp.firestore()，为了保持一致性，您也可以使用 firebaseApp.auth() 和 firebaseApp.storage()。 - samthecodingman

如果这是一个新项目，你应该使用模块化版本以获得更小的包大小。 - Someone Special

Answer 1

您的代码中没有export default XXXX语句。

要正确地导入您使用的db对象，请执行以下操作：

export { db, auth, storage }

您必须使用

import { db } from './firebase'

- samthecodingman

---

我之前尝试过这个，但页面没有加载，反而显示了一个空白页面。 - Golam rabbani Rocky

@GolamrabbaniRocky 一个空白页面并不意味着此修复程序无效，而是表示您需要处理一个与此问题无关的新问题。当您在浏览器中加载应用程序时，请检查浏览器控制台以获取有关新问题的详细信息。 - samthecodingman