Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

203
Views
Module not found: Can't resolve 'firebase' in 'D:\gmail-react\src'

I am installed firebase logged in as well.

I am getting a completely white screen on importing it.

This is the firebase.js file

import firebase from 'firebase'

// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
const firebaseConfig = {
    apiKey: "AIzaSyBb9O35r_N--vwBZNfpxY3vZHzi4wH1oII",
    authDomain: "fir-237a1.firebaseapp.com",
    projectId: " fir-237a1",
    storageBucket: "fir-237a1.appspot.com",
    messagingSenderId: "1055799909510",
    appId: "1:1055799909510:web:c90fad7d5113500585c507"
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const db = app.firestore();
const auth = firebase.auth();
const provider = new firebase.auth.GoogleAuthProvider();

export { db, auth, provider };

This is where I am importing firebase, SendMail.js file

import { db } from "./firebase.js"
import firebase from 'firebase';

function SendMail() {
    const { register, handleSubmit, watch, formState: { errors } } = useForm();
    const dispatch = useDispatch();

    const onSubmit = (formData) => {
        console.log(formData);
        db.collection('emails').add({
            to: formData.to,
            subject: formData.subject,
            message: formData.message,
            timestamp: firebase.firestore.FieldValue.serverTimestamp(),
        });

        dispatch(closeSendMessage());
    };
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

If the files are one by another the import here:

import { db } from "./firebase.js"

Should be like this:

import { db } from "/firebase.js"

without the ".". If you use the "." the file will be searched in the folder above and that is how it looks like. It wen to the src folder witch is probable above the one where your file is.

Also update your firebase.js file to this:

import { getFirestore } from "firebase/firestore";
import { getAuth, GoogleAuthProvider } from "firebase/auth";
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
const firebaseConfig = {
  apiKey: "AIzaSyBb9O35r_N--vwBZNfpxY3vZHzi4wH1oII",
  authDomain: "fir-237a1.firebaseapp.com",
  projectId: " fir-237a1",
  storageBucket: "fir-237a1.appspot.com",
  messagingSenderId: "1055799909510",
  appId: "1:1055799909510:web:c90fad7d5113500585c507",
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const db = getFirestore();
const auth = getAuth();
const provider = new GoogleAuthProvider();

export { db, auth, provider };

and make sure you use the latest Firebase JS SDK Version 9.x

A just saw that a lot of your code has the old SKD 8 in the repo. You can either stay with that syntax by using the compad version in the new SDK or refactor your code to use the new syntax of SDK version 9. Here is a migration guid.

You need to pick one of those two options. I would recommend to migrate to the new version.

With the new SDK version you don't even need the firebase.js file. Your code would look like this:

import { getFirestore, addDoc, collection } from "firebase/firestore";

function SendMail() {
  const {
    register,
    handleSubmit,
    watch,
    formState: { errors },
  } = useForm();
  const dispatch = useDispatch();

  const onSubmit = (formData) => {
    console.log(formData);
    addDoc(collection(db, "emails"), {
      to: formData.to,
      subject: formData.subject,
      message: formData.message,
      timestamp: firebase.firestore.FieldValue.serverTimestamp(),
    });
  };

  dispatch(closeSendMessage());
}
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!