Add an option to use local Firebase emulators
@jamesdaniels 已经在做这个了。
开始于 2021年9月15日。
评估
这个 Issue 还没有评估数据。
描述
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.
- 主要语言
- TypeScript
- 星标
- 3.6k
- 派生
- 403
- 平均合并
- 5 天 1 小时
- 30 天内合并 PR
- 10
环境准备
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
FirebaseExtended/reactfire 的其他 Issue
-
难度 5/5 一周以上 新手友好度 38/100
FirebaseExtended/reactfire#801 ·
-
v5
难度 4/5 3-5 天 新手友好度 48/100
FirebaseExtended/reactfire#793 ·
-
v5
难度 4/5 3-5 天 新手友好度 35/100
FirebaseExtended/reactfire#790 · 2 条评论 ·
-
v5
难度 4/5 3-5 天 新手友好度 55/100
FirebaseExtended/reactfire#789 ·
-
难度 5/5 一周以上 新手友好度 35/100
FirebaseExtended/reactfire#788 ·
查看 FirebaseExtended/reactfire 的全部 Issue
相似的 Issue
-
难度 2/5 1-3 小时 新手友好度 84/100
diegosouzapw/OmniRoute#14869 ·
维护者通常 1 天内回复
-
enhancement
难度 2/5 1-3 小时 新手友好度 82/100
维护者通常 1 天内回复
-
难度 1/5 1 小时以内 新手友好度 94/100
维护者通常 1 天内回复
-
status: waiting triage
难度 2/5 1-3 小时 新手友好度 84/100
freeCodeCamp/freeCodeCamp#70412 ·
维护者通常 1 天内回复
-
Mend: dependency security vulnerability untriaged
难度 1/5 1 小时以内 新手友好度 88/100
opensearch-project/OpenSearch-Dashboards#12816 ·
维护者通常 1 天内回复