Add an option to use local Firebase emulators
@jamesdaniels ci sta già lavorando.
Dal 15/9/2021.
Valutazione
Questa issue non è ancora stata valutata.
Descrizione
After creating an app with react-scripts, initialising Firebase and installing ReactFire, there are still quite a few steps needed to be able to develop the app using the local Firebase emulators:
- Run
firebase emulators:startto start the emulators. - Add
"proxy": "http://localhost:5000"to package.json so that requests for/__/firebase/init.jsonare proxied to the hosting emulator. - Load the config from the hosting emulator, then preload and configure the rest of the emulators, before rendering the app:
import firebase from 'firebase/app'
import ReactDOM from 'react-dom'
import {
FirebaseAppProvider,
preloadAuth,
preloadFirestore,
preloadFunctions,
} from 'reactfire'
const AUTH_DOMAIN = 'example.com'
const FUNCTIONS_REGION = 'europe-west2'
fetch('/__/firebase/init.json').then(async (response) => {
const firebaseConfig = await response.json()
if (process.env.NODE_ENV === 'production') {
firebaseConfig.authDomain = AUTH_DOMAIN
}
const firebaseApp = firebase.initializeApp(firebaseConfig)
await preloadFirestore({
firebaseApp,
setup: async (factory) => {
const firestore = factory()
if (process.env.NODE_ENV !== 'production') {
firestore.useEmulator('localhost', 8080)
}
//if (process.env.NODE_ENV === 'production') {
// await firestore.enablePersistence({ synchronizeTabs: true })
//}
return firestore
},
})
await preloadFunctions({
firebaseApp,
setup: (factory) => {
const functions = factory(FUNCTIONS_REGION)
if (process.env.NODE_ENV !== 'production') {
functions.useEmulator('localhost', 5001)
}
return functions
},
})
await preloadAuth({
firebaseApp,
setup: async (factory) => {
const auth = factory()
if (process.env.NODE_ENV !== 'production') {
auth.useEmulator('http://localhost:9099')
}
return auth
},
})
ReactDOM.unstable_createRoot(document.getElementById('root')).render(
<FirebaseAppProvider firebaseApp={firebaseApp} suspense={true}>
<App />
</FirebaseAppProvider>
)
})
It feels like much of that could be handled inside ReactFire, perhaps with a boolean emulators property (or a config object with values for each emulator as needed) on FirebaseAppProvider. If it could avoid preloading each module until it's needed for the first time that would be ideal.
- Lingua principale
- TypeScript
- Stelle
- 3.6k
- Fork
- 403
- Merge medio
- 5g 1h
- PR unite (30g)
- 10
Guida per i contributori
Apri la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Altre issue di FirebaseExtended/reactfire
-
Difficoltà 5/5 Più di una settimana Idoneità per principianti 38/100
FirebaseExtended/reactfire#801 ·
-
v5
Difficoltà 4/5 3-5 giorni Idoneità per principianti 48/100
FirebaseExtended/reactfire#793 ·
-
v5
Difficoltà 4/5 3-5 giorni Idoneità per principianti 35/100
FirebaseExtended/reactfire#790 · 2 commenti ·
-
v5
Difficoltà 4/5 3-5 giorni Idoneità per principianti 55/100
FirebaseExtended/reactfire#789 ·
-
Difficoltà 5/5 Più di una settimana Idoneità per principianti 35/100
FirebaseExtended/reactfire#788 ·
Tutte le issue di FirebaseExtended/reactfire
Issue simili
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 74/100
-
security
Difficoltà 2/5 1-3 ore Idoneità per principianti 72/100
IBM/node-sdk-core#373 ·
-
e2e-failure ready-to-code
Difficoltà 2/5 1-3 ore Idoneità per principianti 86/100
-
bug
Difficoltà 2/5 1-3 ore Idoneità per principianti 74/100
-
chore
Difficoltà 2/5 1-3 ore Idoneità per principianti 88/100