Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

232
Vistas
How to properly import firebase module in React JS to initializeApp

I'm trying to initialize a firebase app but I don't understand how or where to call it.

I have a file name fire.tsx and inside it there's a call to firebase's initializeApp. But now what? How do I include this in my app?

I thought just by adding import { firebaseApp, firebaseAnalytics } from './fire'; to the top of App.tsx it would work but apparently it doesn't. Am I doing this wrong?

import firebase from "firebase";
import "firebase/auth";
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";


const firebaseConfig = {
  apiKey: "xxx-xx-xx",
  authDomain: "xxx-xx-xx",
  databaseURL: "xxx-xx-xx",
  projectId: "xxx-xx-xx",
  storageBucket: "xxx-xx-xx",
  messagingSenderId: "xxx-xx-xx",
  appId: "xxx-xx-xx",
  measurementId: "xxx-xx-xx"
};

const firebaseApp = initializeApp(firebaseConfig); 
export default firebaseApp;

export const firebaseAuth = firebase.auth();

export const firebaseAnalytics = getAnalytics(); 

App.tsx

import { firebaseApp, firebaseAnalytics } from './fire';

Firebase Error

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Use the new Modular SDK only because the compat version would be removed in future updates. Try refactoring the code this way:

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


const firebaseConfig = {
  apiKey: "xxx-xx-xx",
  authDomain: "xxx-xx-xx",
  databaseURL: "xxx-xx-xx",
  projectId: "xxx-xx-xx",
  storageBucket: "xxx-xx-xx",
  messagingSenderId: "xxx-xx-xx",
  appId: "xxx-xx-xx",
  measurementId: "xxx-xx-xx"
};

const firebaseApp = initializeApp(firebaseConfig); 

export const firebaseAuth = getAuth(firebaseApp);
export const firebaseAnalytics = getAnalytics(firebaseApp); 

The new Modular SDK checks if a default instance is already create so you don't have to like in previous versions.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda