Add an option to use local Firebase emulators
@jamesdaniels đang làm issue này rồi.
Từ ngày 15/9/2021.
Đánh giá
Issue này chưa được đánh giá.
Mô tả
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.
- Ngôn ngữ chính
- TypeScript
- Star
- 3.6k
- Fork
- 403
- Merge trung bình
- 5 ngày 1 giờ
- Pull request đã merge (30 ngày)
- 10
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của FirebaseExtended/reactfire
-
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 38/100
FirebaseExtended/reactfire#801 ·
-
v5
Độ khó 4/5 3-5 ngày Mức phù hợp với người mới 48/100
FirebaseExtended/reactfire#793 ·
-
v5
Độ khó 4/5 3-5 ngày Mức phù hợp với người mới 35/100
FirebaseExtended/reactfire#790 · 2 bình luận ·
-
v5
Độ khó 4/5 3-5 ngày Mức phù hợp với người mới 55/100
FirebaseExtended/reactfire#789 ·
-
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 35/100
FirebaseExtended/reactfire#788 ·
Tất cả issue của FirebaseExtended/reactfire
Issue tương tự
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 74/100
-
security
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 72/100
IBM/node-sdk-core#373 ·
-
e2e-failure ready-to-code
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 86/100
-
bug
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 74/100
-
chore
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 88/100