当我使用 import * as firebase from 'firebase' 导入 firebase 时；？答案

【问题标题】：when I import firebase using import * as firebase from 'firebase';?当我使用 import * as firebase from 'firebase' 导入 firebase 时；？
【发布时间】：2019-07-17 06:55:47
【问题描述】：

显示这个错误？

无法从“App.js”解析“firebase” 构建 JavaScript 包失败。

我曾尝试寻找答案，但这些是针对以前的 firebase 版本我也尝试添加此导入，但没有解决我的问题。

从“@firebase/app”导入 firebase

},
 "dependencies": {
"expo": "^33.0.0",
"firebase": "^6.3.0",
"native-base": "^2.12.1",
"react": "16.8.3",
"react-dom": "^16.8.6",
"react-native": "https://github.com/expo/react-native/archive/sdk- 
33.0.0.tar.gz",
"react-native-gesture-handler": "^1.3.0",
"react-native-web": "^0.11.4",
"react-navigation": "^3.11.1"
 },

谁能帮忙

【问题讨论】：

您可能想查看这篇文章，该文章解释了如何在 Expo blog.expo.io/using-firebase-in-expo-e13844061832987654321@ 中使用 firebase

标签： javascript firebase react-native

【解决方案1】：

您应该以这种方式更新导入和代码以使其正常运行。

import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';

const firebaseConfig = { // Have the firebase config here
  apiKey: "",
  authDomain: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
  measurementId: ""
};

// Use this to initialize the firebase App
const firebaseApp = firebase.initializeApp(firebaseConfig);

// Use these for db & auth
const db = firebaseApp.firestore();
const auth = firebase.auth();

export { auth, db };

【讨论】：

花了 2 个该死的小时搜索最终发现我错过了第一个导入语句中的 /app';。谢谢！顺便说一句：你能解释一下为什么我们需要添加“compat”吗？
是的，我也花了一些时间得出结论。 compat 是为了让 firebase 的第 9 版与第 8 版兼容。我猜他们会将其从 compat 更改为模块化，以用于下一个版本。参考链接：firebase.google.com/docs/web/…

【解决方案2】：

在firebase npm 包的文档中他们说：

如果你使用带有 --experimental-modules 标志的原生 ES6 模块，你应该这样做：
// This import loads the firebase namespace.
import firebase from 'firebase/app';

// These imports load individual services into the firebase namespace.
import 'firebase/auth';
import 'firebase/database';

所以尝试更换

import * as firebase from 'firebase'

与

import firebase from 'firebase/app'

您也可以考虑为 react-native https://github.com/invertase/react-native-firebase 使用 firebase 包装器构建。它需要您进行文档中描述的额外设置，但效果更好。

【讨论】：

我将我的 firebase 从 6.0.3 降级到 5.0.3 并且错误消失了但是当我 firebase.auth().onAuthStateChanged((authenticate)=>{ if(authenticate){ this.props.navigation .replace("homeScreen") }else{ this.props.navigation.replace("signInScreen") } }) 它显示找不到变量：firebas
使用 firebase 函数，在哪里可以指定节点 --experimental-modules 标志？如果从命令行运行节点，我了解如何使用该标志，但如果您使用的是 firebase “serve” 命令，如何指定它？
你在使用 TypeScript 吗？在 TS 中，我认为这些模块默认工作，可能会更改 tsconfig。我实际上没有在 Node.js 上的 JS（不是 TS）中使用 firebase...

【解决方案3】：

试试：

npm install --save firebase

【讨论】：