Ошибка типа: firebase_совместимость_приложение__ВЕБ-ПАКЕТ_ИМПОРТИРОВАННЫЙ_МОДУЛЬ_0__.по умолчанию.firestore не является функцией

# #javascript #reactjs #firebase

Вопрос:

Просто пытаюсь настроить firebase в первый раз, и я получаю эти ошибки, не могу найти правильный ответ для работы, это моя конфигурация

 // Import the functions you need from the SDKs you need
import firebase from 'firebase/compat/app';
import 'firebase/firestore';
import {
  initializeApp
}
from "firebase/app";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
const firebaseConfig = {
  apiKey: "x",
  authDomain: "x",
  projectId: "x",
  storageBucket: "x",
  messagingSenderId: "x",
  appId: "x"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const db = firebase.firestore();
export {
  db
};
 

ошибка, которую я получаю —
Ошибка типа: firebase_совместимость_приложение__ВЕБ-ПАКЕТ_ИМПОРТИРОВАННЫЙ_МОДУЛЬ_0__.по умолчанию.firestore не является функцией

это показывает на строку const db = firebase.firestore();

Ответ №1:

Если вы хотите использовать compat версию firestore, вам необходимо также инициализировать firebaseApp ее с помощью этой compat версии. Я бы рекомендовал использовать новую версию SDK для обоих:

 
import { getFirestore } from "firebase/firestore";
import { initializeApp } from "firebase/app";

const firebaseConfig = {
  apiKey: "x",
  authDomain: "x",
  projectId: "x",
  storageBucket: "x",
  messagingSenderId: "x",
  appId: "x",
};


const app = initializeApp(firebaseConfig);
const db = getFirestore();
export { db };
 

С новым SDK вам на самом деле не нужен такой файл, как раньше, где вы инициализируете свое приложение и создаете экземпляры базы данных. После того, как вы инициализируете свое приложение с помощью нового SDK, вы можете просто позвонить getFirestore() без необходимости firebaseApp в нем. getFirestore() будет автоматически использоваться приложение по умолчанию.

Прослушиватель в реальном времени с помощью collection будет выглядеть следующим образом:

 import { collection, onSnapshot } from "firebase/firestore";

const unsubscribe = onSnapshot(collection(db, "cities"), () => {
  // Respond to data
  // ...
});

// Later ...

// Stop listening to changes
unsubscribe();
 

Когда вы прочитаете документы Firebase, обязательно переключитесь на версию SDK 9:

введите описание изображения здесь

Комментарии:

1. Спасибо!, и что делать, если я получу ту же ошибку при попытке использовать «коллекции»

2. Можете ли вы, пожалуйста, показать мне, как вы используете colletions

3. useEffect(()=> { db.collection(‘todos’). onSnapShot(снимок =>> { setTodos(снимок.docs.map(doc =>>> doc.данные().todo))) }) },[]);