Question

21

Upgrade to Firebase JS 8.0.0: Attempted import error: 'app' is not exported from 'firebase/app' (imported as 'firebase')

rated 0 times [ 28] [ 7] / answers: 1 / hits: 78120 / 4 Years ago, mon, october 26, 2020, 12:00:00

After upgrading to 8.0.0, I get the following error:

Attempted import error: 'initializeApp' is not exported from 'firebase/app' (imported as 'firebase').

My import looks like this:

import * as firebase from "firebase/app"

firebase.initializeApp({ ... })

TypeScript also complains:

Property 'initializeApp' does not exist on type 'typeof import("/path/to/my/file")'. ts(2339)

How do I fix this?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

daja

Add To Favorites

Follow

Total Points: 407

Total Questions: 103

Total Answers: 103

Location: Ghana

Member since Sun, Mar 27, 2022

2 Years ago

daja questions

1 How to delete a file in antd Upload component

Tue, Dec 21, 21, 00:00, 2 Years ago

1 map() with async vs promise.all()

Thu, Apr 23, 20, 00:00, 4 Years ago

1 React useEffect (with []) is called every time I change page (React Router)

Fri, Oct 25, 19, 00:00, 5 Years ago

1 Detect URL change in querystring

Fri, Sep 6, 19, 00:00, 5 Years ago

1 How to query relations with Knex.js?

Tue, Jul 23, 19, 00:00, 5 Years ago

View All

answered 4 Years ago bretd · Accepted Answer

In version 8.0.0, the Firebase SDK had a breaking change in the way it handles exports:

Breaking change: browser fields in package.json files now point to ESM
bundles instead of CJS bundles. Users who are using ESM imports must
now use the default import instead of a namespace import.

Before 8.0.0
import * as firebase from 'firebase/app'
After 8.0.0
import firebase from 'firebase/app'
Code that uses require('firebase/app') or require('firebase') will
still work, but in order to get proper typings (for code completion,
for example) users should change these require calls to
require('firebase/app').default or require('firebase').default. This
is because the SDK now uses typings for the ESM bundle, and the
different bundles share one typings file.

So, you will have to use the new ESM bundle default export:

import firebase from "firebase/app"

firebase.initializeApp({ ... })

If you are working with SDK version 9.0, read this question instead:

How do I fix a Firebase 9.0 import error? "Attempted import error: 'firebase/app' does not contain a default export (imported as 'firebase')."