TypeError:_firebase__WEBPACK_IMPORTED_MODULE_5 __。default不是构造函数

问题描述 投票:1回答:1

我正在尝试遵循本教程:https://www.robinwieruch.de/complete-firebase-authentication-react-tutorial

我在这一步陷入困境:

Context.jsx

import React from 'react';

const FirebaseContext = React.createContext(null);

export default FirebaseContext;

index.js

import firebase from "./firebase";
import  FirebaseContext  from './components/firebase/Context';

ReactDOM.render(
  <FirebaseContext.Provider value={new firebase()}>
    <App />
  </FirebaseContext.Provider>,
  document.getElementById('root'),
);

[当我尝试实现它时,它会产生一个错误:

TypeError:_firebase__WEBPACK_IMPORTED_MODULE_5 __。default不是构造函数

[当我搜索该错误消息时,我得到old posts,它表示Firebase文档在最近几年已更改,但本教程比该更改更新。

我的firebase.js具有:

import * as firebase from "firebase";
import firestore from "firebase/firestore";
import 'firebase/auth';

const config = {
  apiKey: "",
  authDomain: ".firebaseapp.com",
  databaseURL: ".firebaseio.com",
  projectId: "",
  storageBucket: ".appspot.com",
  messagingSenderId: "",
  appId: ""
};

firebase.initializeApp(config);
const database = firebase.database();
const fsDB = firebase.firestore();
const settings = { timestampsInSnapshots: true };

export { firebase,  database as default, fsDB, settings };

有人知道如何解决这个问题。

javascript reactjs firebase
1个回答
0
投票

您需要将其更改为:

import app from 'firebase/app';
import 'firebase/auth';
import 'firebase/database';

const config = {
  apiKey: "",
  authDomain: ".firebaseapp.com",
  databaseURL: ".firebaseio.com",
  projectId: "",
  storageBucket: ".appspot.com",
  messagingSenderId: "",
  appId: ""
};

class Firebase {
  constructor() {
    app.initializeApp(config);
    this.database = firebase.database();
    this.fsDB = firebase.firestore();
  }
}

export default Firebase
© www.soinside.com 2019 - 2024. All rights reserved.