CODEWITHSUNDEEP
javascriptreactjsfirebasegoogle-cloud-firestore
Dan Shawl
Dan Shawl

Reputation: 1

Failed to compile ./src/App.js Module not found: Can't resolve 'firebase'

Any and all help would be appreciated! I continue to get this and other errors involving firestore() not being function, etc. I'm not sure how to fix this, I created a to-do react app with firebase and had no issues and a week later I'm receiving errors on any firebase project I create.

I've tried doing import firebase from 'firebase/compat/app' with other imports for firestore, auth, and storage with no luck. I've also tried importing initializeApp from 'firebase/app', although I'm not 100% sure if I've done that correctly.

Currently my firebase.js file looks like:


import firebase from 'firebase';

const firebaseApp = firebase.initializeApp({
  ...
});

const db = firebaseApp.firestore();
const auth = firebase.auth();
const storage = firebase.storage();

export { db, auth, storage };

I am doing import { db } from './firebase' in my app.js file.

Upvotes: 0

Views: 301

Answers (1)

Dharmaraj
Dharmaraj

Reputation: 50850

If you have v9.0.0+ installed, then change your import to compat version:

import firebase from 'firebase/compat/app';
// import "firebase/compat/[SERVICE_NAME]"

I'd recommend checking out the new Modular SDK which has certain performance benefits. You can checkout this Firecast to learn more about the new SDK. The new syntax looks like:

import { initializeApp } from 'firebase/app';
import { getAuth } from 'firebase/auth';
import { getFirestore } from 'firebase/firestore';
import { getStorage } from 'firebase/storage';

const firebaseApp = initializeApp({
  ...
});

const db = getFirestore(firebaseApp);
const auth = getAuth(firebaseApp);
const storage = getStorage(firebaseApp);

export { db, auth, storage };

Upvotes: 1

Related Questions