Search code examples
javascriptfirebasevue.jsvite

The requested module '/node_modules/.vite/deps/firebase_app.js?v=bdc3ec1e' does not provide an export named 'getApps'


Haven't had an issue until all of a sudden today. I have not changed any firebase.js code or any firebase rules anytime recently that could cause such an error. I'm using Vue 3 with Vite. I'm currently on Firebase version 10.0.0 which is latest.

Error:

Uncaught SyntaxError: The requested module '/node_modules/.vite/deps/firebase_app.js?v=bdc3ec1e' does not provide an export named 'getApps' (at firebase.js:1:471)

firebase.js

import {
  getApps,
  initializeApp
} from "firebase/app";

import {
  getAuth,
  onAuthStateChanged,
  sendEmailVerification
} from "firebase/auth";

const firebaseConfig = {
  apiKey: import.meta.env.VITE_APP_API_KEY,
  authDomain: import.meta.env.VITE_APP_AUTH_DOMAIN,
  projectId: import.meta.env.VITE_APP_PROJECT_ID,
  storageBucket: import.meta.env.VITE_APP_STORAGE_BUCKET,
  messagingSenderId: import.meta.env.VITE_APP_MESSAGING_SENDER_ID,
  appId: import.meta.env.VITE_APP_APP_ID,
  measurementId: import.meta.env.VITE_APP_MEASUREMENT_ID
};

const apps = getApps()
const firebaseApp = !apps.length ? initializeApp(firebaseConfig) : apps[0]
const firebaseAuth = getAuth(firebaseApp)

const getCurrentUser = () => new Promise((resolve, reject) => {
  const unsub = onAuthStateChanged(firebaseAuth, user => {
    unsub()
    resolve(user)
  }, reject)
})

export const createUserWithEmailAndPassword = (email, password) => {
  return firebaseAuth.createUserWithEmailAndPassword(email, password)
}

export const signInWithEmailAndPassword = (email, password) => {
  return firebaseAuth.signInWithEmailAndPassword(email, password)
}

// send Email Verification to user after sign up
export const sendEmailVerificationToUser = () => {
  return sendEmailVerification(firebaseAuth.currentUser)
}

// reauthenticateUser, updatePassword
export const reauthenticateUser = (password) => {
  const user = firebaseAuth.currentUser
  const cred = firebaseAuth.EmailAuthProvider.credential(user.email, password)
  return user.reauthenticateWithCredential(cred)
}

export const updatePassword = (password) => {
  return firebaseAuth.currentUser.updatePassword(password)
}

export { firebaseApp, firebaseAuth, getCurrentUser }

Solution

  • I had the same issue. To solve it I did the following:

    1. delete pacakge-lock.json
    2. run "npx rimraf ./**/node_modules" on my project folder to remove node modules
    3. run npm install

    Hope it Helps