Home > front end >  How can I provide options when not being deployed to hosting via source?
How can I provide options when not being deployed to hosting via source?

Time:10-11

I'm building a project in React where it has authentication so I'm using firebase

I have encountered this error

Firebase: Need to provide options, when not being deployed to hosting via source. (app/no-options)

here is my config-firebase file:

import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";

// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: "AIzaSyBoKEW_g0gOwNKkHGMAyhXxC0ESfdsVhKI",
  authDomain: "kargoevi-auth.firebaseapp.com",
  projectId: "kargoevi-auth",
  storageBucket: "kargoevi-auth.appspot.com",
  messagingSenderId: "726037811463",
  appId: "1:726037811463:web:42d75c7f5c1d1b5b9bf5a2",
  measurementId: "G-PJXGLVZ6GQ",
};

export const auth = getAuth(app);
const app = initializeApp(firebaseConfig);

export default app;

here is my Auth file:

import React, { useState, useEffect } from "react";
import { onAuthStateChanged } from "firebase/auth";
import { auth } from "./base";

export const AuthContext = React.createContext();

export const AuthProvider = ({ children }) => {
  const [currentUser, setCurrentUser] = useState(null);
  const [pending, setPending] = useState(true);

  useEffect(() => {
    onAuthStateChanged(auth, (user) => {
      setCurrentUser(user);
      setPending(false);
    });
  }, []);
  if (pending) {
    return <>Loading...</>;
  }

  return (
    <AuthContext.Provider
      value={{
        currentUser,
      }}
    >
      {children}
    </AuthContext.Provider>
  );
};

note: I'm not trying to deploy it yet

any ideas on how can I fix this error?

CodePudding user response:

Firebase app must be initialized before you use any other Firebase services so make sure the initializeApp() function is called first.

// correct order 
const app = initializeApp(firebaseConfig);
export const auth = getAuth(app);

It's best to use the exported auth instance in other files. If you use getAuth() in other files as well, there's a chance initializeApp() has not been called yet leading to same error.

  • Related