Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

Enable direct ad-hoc imports

Offen
#480 1 Kommentar 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Anfängerfreundlichkeit
35/100
Issue-Typ
Feature
Klarheit
Größtenteils klar
Aktivitätsstatus
Veraltet
Tech-Stack
firebase, react, react-native, typescript

Rechercherichtung

Beginne damit, den IDBIndex-Fehler in einer neuen Expo-App mit den aufgeführten Versionen von React Native, Reactfire und Firebase zu reproduzieren, und untersuche anschließend, wie Reactfire seine Provider exportiert. Als abgeschlossen gilt die Aufgabe, wenn Verbraucher nur die benötigte Komponente, etwa FirebaseAppProvider, importieren können, ohne nicht verwandte Funktionalität zu laden oder den Fehler auszulösen.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

v5

Can't find variable: IDBIndex when setting up on Expo

I used the same hierarchy I had working on the web. I am not using performance or analytics, so I think all of the underlying components should work.

But, I believe that since there isn't a way (that I can tell) to import only specific components, I end up with an error as if I were importing performance package.

import React from 'react'
import { getAuth, connectAuthEmulator } from 'firebase/auth'
import { getFunctions, connectFunctionsEmulator } from "firebase/functions"
import { getStorage, connectStorageEmulator } from "firebase/storage"
import { getFirestore, connectFirestoreEmulator } from "firebase/firestore";
import { FirebaseAppProvider, useFirebaseApp, AuthProvider, StorageProvider, FirestoreProvider } from 'reactfire';

function FirebaseComponents({ children }) {
  const app = useFirebaseApp() // a parent component contains a `FirebaseAppProvider`
  const auth = getAuth(app)
  const functions = getFunctions(app)
  const firestoreInstance = getFirestore(app)
  const storage = getStorage(app)

  return (
    <AuthProvider sdk={auth}>
      <FirestoreProvider sdk={firestoreInstance}>
        <StorageProvider sdk={storage}>
            {children}
        </StorageProvider>
      </FirestoreProvider>
    </AuthProvider>
  );
}

function AllFirebaseComponents({ children, fire }) {
    return (
        <FirebaseAppProvider firebaseApp={fire} >
          <FirebaseComponents>
            {children}
          </FirebaseComponents>
        </FirebaseAppProvider>
    )
  }

export default AllFirebaseComponents
Version info

"react": "^17.0.2",
"react-native": "~0.63.4",
"reactfire": "^4.2.0",
"firebase": "^9.0.1",

Test case

TBU, will try to get one of these

Steps to reproduce

Start a new expo app, attempt to use reactfire. Get error mentioned above.

Expected behavior

Be able to import only the components needed, ex:

import FirebaseAppProvider from 'reactfire/FirebaseAppProvider';
Actual behavior

I get the error mentioned above which I think comes from the performance stuff

Vorherrschende Sprache
TypeScript
Sterne
3.6k
Forks
403
Ø Merge
5 T. 1 Std.
Gemergte PRs (30 T.)
10

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus FirebaseExtended/reactfire

Alle Issues in FirebaseExtended/reactfire

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.