EN
React - firebase import error
1
answers
0
points
I have a problem with importing firebase into React.
I was trying to import the Firebase like this but it didn't work:
import firebase from 'firebase/app';
import 'firebase/auth';
const app = firebase.initializeApp({
apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID,
appId: process.env.REACT_APP_FIREBASE_APP_ID,
});
export const auth = app.auth();
export default app;
I got the following error:
Attempted import error: 'firebase/app' does not contain a default export (imported as 'firebase').
Then I change the imports like this:
import { initializeApp } from 'firebase/app';
import 'firebase/auth';
const app = initializeApp({
apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID,
appId: process.env.REACT_APP_FIREBASE_APP_ID,
});
export const auth = app.auth();
export default app;
and now I have this error:
TypeError: app.auth is not a function
I've done everything from the youtube tutorial but it didn't work for me. I've installed the firebase in my project using npm install firebase, checked directory like million times, even tried installing it locally with npm install --save firebase or changing import into require(), didn't work.
What is the right way to import Firebase in React?
1 answer
0
points
There were some updates on firebase, that's why you can't import it like this.
Instead of:
import firebase from 'firebase/app';
import 'firebase/auth';
Use this:
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
0 comments
Add comment