Hello Guys, How are you all? Hope You all Are Fine. Today I am implementing firebase in my app But I am facing the following error Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’) in ReactJs. So Here I am Explain to you all the possible solutions here.
Without wasting your time, Let’s start This Article to Solve This Error.
- How Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’) Error Occurs ?
- How To Solve Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’) Error ?
- Solution 1: use the /compat folder in imports
- Solution 2: Downgrade firebase version
- Solution 3: create a Firebase App object Like below example
- Summery
How Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’) Error Occurs ?
Today I am implementing firebase in my app But I am facing the following error.
./src/firebase.js Attempted import error: 'firebase/app' does not contain a default export (imported as 'firebase').
Here is my code.
import firebase from "firebase/app";
import "firebase/auth";
How To Solve Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’) Error ?
How To Solve Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’) Error?
To Solve Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’) Error If You are using Version 9 then don’t forget that things changed a bit for importing firebase Now there is a “compatibility” option so can use the /compat folder in your imports. Here is an example Replace This line. import firebase from “firebase/app”; With This import firebase from ‘firebase/compat/app’; second solution is If you are facing this error then just downgrade to any of the firebase versions that lowers than v9.
Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’)
To Solve Attempted import error: ‘firebase/app’ does not contain a default export (imported as ‘firebase’) Error If You are using Version 9 then don’t forget that things changed a bit for importing firebase Now there is a “compatibility” option so can use the /compat folder in your imports. Here is an example Replace This line. import firebase from “firebase/app”; With This import firebase from ‘firebase/compat/app’; second solution is If you are facing this error then just downgrade to any of the firebase versions that lowers than v9.
Solution 1: use the /compat folder in imports
If You are using Version 9 then don’t forget that things changed a bit for importing firebase Now there is a “compatibility” option so can use the /compat folder in your imports. Here is an example.
Replace This line.
import firebase from "firebase/app";
With This.
import firebase from 'firebase/compat/app';
Here is some example which is changed in version 9
//to use firebase app
import firebase from 'firebase/app'; //older version
import firebase from 'firebase/compat/app'; //v9
//to use auth
import 'firebase/auth'; //older version
import 'firebase/compat/auth'; //v9
//to use firestore
import 'firebase/firestore'; //Older Version
import 'firebase/compat/firestore'; //v9
Solution 2: Downgrade firebase version
If you are facing this error then just downgrade to any of the firebase versions that lowers than v9.
Solution 3: create a Firebase App object Like below example
- Install Firebase using npm.
- npm install firebase
- Initialize Firebase in your app and create a Firebase App object Like this below example.
import { initializeApp } from 'firebase/app';
// TODO: Replace the following with your app's Firebase project
configuration const firebaseConfig = { //... };
const app = initializeApp(firebaseConfig);
Summery
It’s all About this issue. Hope all solution helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you?
Also, Read
thank you so much
Love you bro!!
Love you bro!! Thank you so much.
Welcome Brother !! And Thank you For your valuable comment ❤
You saved me! Thank you so much!
Thank you sir
Thank you so much! I was following a youtube instruction video and got stuck at this error for 3 hours, then gave up and went to sleep.
Thank you so much i was thinking that i will not be able to continue my project because of this error but you have solved my problem by giving valuable content.
Thank you so much
Welcome Brother !! And Thank you For your valuable comment ❤
Thank You So Much You Saved My Vacations….
Welcome Brother !! And Thank you For your valuable comment ❤
thank you Master yoda.
God bless you. You don’t even know man
Thank you allot,
Awesome!
you helped me thank you bro
Still, in 2022 the same issues,
thanks bro, you saved my sanity
Solved with first method. Yoooo Thanks so much.
Thank you so much for that!
Really saved me a lot of time!!
My pleasure to help You.