Why is firebase undefined when used with electron?

Question

I have the following:

• Fresh install of electron-react-boilerplate
• firebase ^9.8.4 in package.json

In renderer I have the following code:

import firebase from 'firebase/app';

const config = {
  /* ACTUAL CONFIG FROM FIREBASE CONSOLE */
  /* snip */
};

const fire = firebase.initializeApp(config, 'default');

When I npm start I get the following error in the renderer window:

Cannot read properties of undefined (reading 'initializeApp')

It appears firebase is undefined. All other packages I've added worked fine. What is the issue?

Answer 1

Google changed the syntax required between version 8 and version 9. While many examples abound on how to use firebase, many are based on version 8 which allows the above syntax. When using version 9, the following syntax is used:

import { initializeApp } from 'firebase/app';

const config = {
  /* ACTUAL CONFIG FROM FIREBASE CONSOLE */
  /* snip */
};

const fire = initializeApp(config, 'default');