Add an option to use local Firebase emulators
@jamesdaniels já está trabalhando nisso.
Desde 15/9/2021.
Avaliação
Esta issue ainda não foi avaliada.
Descrição
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.
- Linguagem predominante
- TypeScript
- Estrelas
- 3.6k
- Forks
- 403
- Merge médio
- 5d 1h
- PRs com merge (30d)
- 10
Guia de contribuição
Primeiros passos
- Leia a issue inteira e depois o guia de contribuição do projeto.
- Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
- Faça um fork do repositório e trabalhe em uma branch.
- Abra um pull request que referencie o número da issue.
Mais de FirebaseExtended/reactfire
-
Dificuldade 5/5 Mais de uma semana Facilidade para iniciantes 38/100
FirebaseExtended/reactfire#801 ·
-
v5
Dificuldade 4/5 3-5 dias Facilidade para iniciantes 48/100
FirebaseExtended/reactfire#793 ·
-
v5
Dificuldade 4/5 3-5 dias Facilidade para iniciantes 35/100
FirebaseExtended/reactfire#790 · 2 comentários ·
-
v5
Dificuldade 4/5 3-5 dias Facilidade para iniciantes 55/100
FirebaseExtended/reactfire#789 ·
-
Dificuldade 5/5 Mais de uma semana Facilidade para iniciantes 35/100
FirebaseExtended/reactfire#788 ·
Todas as issues de FirebaseExtended/reactfire
Issues semelhantes
-
Dificuldade 2/5 1-3 horas Facilidade para iniciantes 84/100
bcgov/bc-wallet-mobile#4761 · 1 comentário ·
-
external-issue to-triage
Dificuldade 2/5 1-3 horas Facilidade para iniciantes 88/100
-
area-deployment area-integrations triage:bot-seen
Dificuldade 2/5 Meio dia Facilidade para iniciantes 86/100
-
Dificuldade 2/5 1-3 horas Facilidade para iniciantes 82/100
-
refactor
Dificuldade 2/5 1-3 horas Facilidade para iniciantes 84/100