ameyaraje
ameyaraje

Reputation: 177

TypeError: firebase_app__WEBPACK_IMPORTED_MODULE_0__.database is not a function

I'm trying to add Firebase to my ReactJS app and having some trouble doing so. I'm following the guide from https://firebase.google.com/docs/web/setup#node.js-apps to understand how it works. Attached is a screenshot of the error.

My Firebase specific code sits in another file called firebase.js and I call it from my index.js file (this is just a first pass, I want to see if I can get connectivity to the Realtime Database).

firebase.js

import firebase from 'firebase/app';

var firebaseConfig = {
    apiKey: "....",
    authDomain: "....",
    databaseURL: ".....",
    projectId: "....",
    storageBucket: "....",
    messagingSenderId: "....",
    appId: "....",
    measurementId: "...."
};

firebase.initializeApp(firebaseConfig);

firebase.database().ref().set({
    'name': 'blah'
});

I then go on to import this file in index.js to see if it works. Here's the error I see: enter image description here

I have temporarily changed the rules on the DB to allow anyone to write to it (authentication hasn't been added yet).

{
  "rules": {
    ".read": true,
    ".write": true
  }
}

Upvotes: 0

Views: 4777

Answers (1)

ameyaraje
ameyaraje

Reputation: 177

Credit to this answer: https://stackoverflow.com/a/38250513/6205548.

Turns out every component now needs to be imported individually. Adding the line import 'firebase/database' solved the issue.

Upvotes: 5

Related Questions