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:

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    }  }  

https://stackoverflow.com/questions/66147388/typeerror-firebase-app-webpack-imported-module-0-database-is-not-a-function February 11, 2021 at 09:04AM