Firebase v9 Beta 庫的模塊化使用

Question

其他重要信息：

1. 項目使用 React 庫
2. 使用 Create React App 初始化

這是我的代碼在 v8 上通常的樣子：

// firebase.js

import firebase from "firebase/app";
import "firebase/firestore";

export const app = firebase.initializeApp(config);
export const firestore = app.firestore();

// app.js
import { firestore } from './firebase'

firestore.collection("users").get().then((querySnapshot) => {
    querySnapshot.forEach((doc) => {
        console.log(`${doc.id} => ${doc.data()}`);
    });
});

我相信在 v9 中，Firebase 不再有這種副作用導入問題，所以現在我們明確說明我們想要從包中獲得哪些功能。

// firebase.js
import { initializeApp } from 'firebase/app'
import { getFirestore } from 'firebase/firestore'

export const app = initializeApp(config)
export const firestore = getFirestore()

下面的代碼來自Firebase 文檔

// app.js
import { addDoc, collection } from "firebase/firestore"; 

try {
  const docRef = await addDoc(collection(db, "users"), {
    first: "Alan",
    middle: "Mathison",
    last: "Turing",
    born: 1912
  });

  console.log("Document written with ID: ", docRef.id);
} catch (e) {
  console.error("Error adding document: ", e);
}

將上面的代碼（使用addDoc和collection進口）指的是初始化實例的FireStore在firebase.js ，還是有使用初始化實例的FireStore有道？

Answer 1

Firestore 實例由核心 Firebase 應用程序管理，firestore 模塊僅包含發出請求的庫。 無需引用核心應用即可獲取 Firestore 實例的解決方案是從 Firestore 模塊請求實例。

import { getFirestore } from 'firebase/firestore';

const db = getFirestore();

來源： https : //firebase.google.com/docs/firestore/quickstart#initialize