尝试导入错误：“@firebase/app”不包含默认导出（导入为“e”）答案

【问题标题】：Attempted import error: '@firebase/app' does not contain a default export (imported as 'e')尝试导入错误：“@firebase/app”不包含默认导出（导入为“e”）
【发布时间】：2021-10-20 10:19:54
【问题描述】：

我想为我的 react 应用启用 firestore。

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

const firebaseConfig = {
  apiKey: "",
  authDomain: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
  measurementId: ""
};

firebase.initializeApp(firebaseConfig);

export const db = firebase.firestore();

export default firebase;

当我尝试将 firebase 导入如下组件时

import firebase from 'fbconfig';

我收到错误消息：

Failed to compile.

./node_modules/@firebase/firestore/dist/esm5/index.js
Attempted import error: '@firebase/app' does not contain a default export (imported as 'e').

我的浏览器显示的错误是

Failed to compile

./node_modules/@firebase/firestore/dist/esm5/index.js
Attempted import error: '@firebase/app' does not contain a default export (imported as 'e').

This error occurred during the build time and cannot be dismissed.

我该如何解决这个问题？

【问题讨论】：

您能否添加您收到的完整堆栈跟踪错误，并包括您使用的 Firebase SDK 和服务的版本？
"firebase": "^8.10.0" 无法编译 ./node_modules/@firebase/firestore/dist/esm5/index.js 尝试导入错误：'@firebase/app' 不包含默认导出（导入为“e”）。此错误发生在构建期间，无法消除。
这就是你所说的堆栈跟踪错误吗？

标签： reactjs firebase google-cloud-firestore react-bootstrap

【解决方案1】：

就我而言，我在解决方案下使用。我更改了 “firebase/app” -> “firebase/compat/app”。这解决了问题。因为firebase版本，出现了这个问题。

// 从 'firebase/app' 导入 firebase; //旧版本

从 'firebase/compat/app' 导入 firebase； //v9

【讨论】：

我通过运行 $npm install firebase@9.1.3 并从'firebase/compat/app'导入了firebase，将我的firebase版本更新为@9.1.3；这个应用程序就像一个魅力。非常感谢。