Firebase 9.8.3报firebase/compat/app无default导出错误排查
Firebase 9.8.3 compat层导入报错排查
报错原因
你看到的export 'default' (imported as 'firebase') was not found in 'firebase/compat/app'报错,核心触发原因是Firebase 9.8.3版本的compat兼容层在ESModule解析模式下没有提供默认导出项,你使用import firebase from 'firebase/compat/app'的默认导入语法时,打包工具无法匹配到对应的导出内容,直接抛出模块无导出的错误。
除此之外你的代码里还有一处API拼写错误,就算解决导入问题,运行时也会触发函数不存在的异常。
修复步骤
- 替换默认导入语法为命名空间导入,适配compat层的导出规则:
将原代码第一行的导入语句
替换为import firebase from 'firebase/compat/app';import * as firebase from 'firebase/compat/app'; - 修正Firestore实例获取的拼写错误:原代码中
firebaseApp.fireStore()的方法名大小写错误,compat层对应方法为全小写的firestore(),修改为const db = firebaseApp.firestore();即可。
修复后完整配置代码
// For Firebase JS SDK v7.20.0 and later, measurementId is optional import * as firebase from 'firebase/compat/app'; import 'firebase/compat/auth'; import 'firebase/compat/firestore'; const firebaseConfig = { apiKey: "AIzaSyCx0tcar2EmnD2tGQ3CjNDy3-Tf363YiPM", authDomain: "starvana2-9d9db.firebaseapp.com", projectId: "starvana2-9d9db", storageBucket: "starvana2-9d9db.appspot.com", messagingSenderId: "508991125201", appId: "1:508991125201:web:8f4b5c7fbf718fb4db77f0", measurementId: "G-7S7H73K4HL" }; const firebaseApp = firebase.initializeApp(firebaseConfig); const db = firebaseApp.firestore(); const auth = firebase.auth(); export { db, auth }; export default firebase;
补充说明:compat层是Firebase为了兼容v8及之前版本的写法提供的过渡层,无法享受v9版本的模块化Tree Shaking体积优化。如果后续有性能/包体积优化需求,可以迁移到v9原生的模块化写法,不过需要全量修改项目中所有Firebase API的调用方式,改动成本更高。
内容的提问来源于stack exchange,提问作者HWrobo
相关产品推荐
相关产品推荐

