Solved : Firebase says firebaseui didn't support v9 But firebaseui say it supports v9 . Which one correct?

Solution

import StyledFirebaseAuth from 'react-firebaseui/StyledFirebaseAuth';
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/auth';
import { getAuth } from 'firebase/auth';

<StyledFirebaseAuth uiConfig={firebaseAuthConfig}firebaseAuth={getAuth()} className="googleBtn"/>

view more

Problem

Firebase not initalized but I do in _app.js See Image 1

I initalized manually again it says duplicate See Image 2

I authenticate with Next-firebase-auth package. I download the example files and it works ( Firebase v8 & firebaseui v6 )

So I install auth package in my app and changed some files. here how I Import

• Firebase v9

• firebaseui v6

And I copy / paste some code and run the code but It didn't work . Error told me to intialize firebase app (I think I don't need because already initlize in _app.js)

And then I initialize firebase app again and Error say Firebase app already initalize (duplicate)

firebaseerror: firebase: no firebase app '[default]' has been created - call firebase app.initializeapp() (app-compat/no-app).

<StyledFirebaseAuth
            uiConfig={firebaseAuthConfig}
Error line-> firebaseAuth={firebase.auth()}/>

I found the solution I make a mistake with version problem

import StyledFirebaseAuth from 'react-firebaseui/StyledFirebaseAuth';
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/auth';
import { getAuth } from 'firebase/auth';

<StyledFirebaseAuth uiConfig={firebaseAuthConfig}firebaseAuth={getAuth()} className="googleBtn"/>

view more