I'm currently facing an issue while incorporating firebase-ui into a VueJS project.
My API credentials are stored in a file named config.js
export default {
apiKey: "*****",
authDomain: "*****.firebaseapp.com",
databaseURL: "https://my-project.firebaseio.com",
projectId: "*****",
storageBucket: "*****",
messagingSenderId: "73482979",
appId: "1:685818581200:web:1f5ebjnfsdjnj",
measurementId: "G-BHJK6N67PZ"
};
The config.js file is imported into my init.js where the entire firebase setup is completed:
import config from "./config";
import firebase from "firebase";
import firebaseui from "firebaseui";
import "firebase/auth";
import "firebase/firestore";
const app = firebase.initializeApp(config);
const auth = firebase.auth();
const firestore = app.firestore();
const authUi = new firebaseui.auth.AuthUI(auth); //An error occurs at this point
export default app;
export { auth, authUi, firestore };
Unfortunately, I've been stuck for several days now with the error message -> Cannot read property 'auth'
of undefined'. I have followed the documentation (https://firebase.google.com/docs/auth/web/firebaseui#before_you_begin) meticulously, and have even upgraded to the latest firebaseui version
"firebaseui": "4.7.0"
as specified in the package.json file.
Any assistance on how to resolve this issue would be greatly appreciated.