Firebase: No Firebase App '[DEFAULT]' has been created - call initiali

Firebase: No Firebase App '[DEFAULT]' has been created - call initializeApp() first (app/no-app).のエラー

Vue Nuxtのプロジェクトで上記エラーが出てしまいました。

FireStoreから値を取得しようとしてメソッドを記載していたらおきました。

前提として、

• firebaseのAuthメソッドではエラーが起きず、userのemail情報を取得可能
• firebaseとの連携を確認済み

原因

• FireStoreの値を取得しようとしてメソッドを記載したらエラーになった。

原因はエラー内容のまんま

Firebaseアプリが初期化される前にFirestoreを取得しようとしているためエラーがおきました。
下記のconst db = getFirestore()を見てもらえるとわかるかと思います。

import { getAuth, signInWithEmailAndPassword } from 'firebase/auth'
import {
  getFirestore,
  collection,
  getDoc,
  getDocs,
} from 'firebase/firestore'
import { useUserEmail } from '~/composable/store/store'
import type { User } from '~/types'

const db = getFirestore() // ここで宣言していた為、エラーがおきた。

export const useFirebase = () => {
  // const db = getFirestore()　←ここで宣言した場合エラーは解消された。
  //　コレクション共通
  const getCollection = async (name: String) => {
    const userRef = collection(db, `${name}`)
    const snapshot = await getDocs(userRef)
    return snapshot
  }
  //　ログイン用
  const useAuth = async (email: string, password: string) => {
    const auth = getAuth()
    const userEmail = useUserEmail()
    await signInWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        userEmail.value = userCredential.user.email || ''
      })
      .catch((error) => {
        console.log(error)
      })
  }
  //　user情報取得
  const getUser = async () => {
    const snapshot = await getCollection('user')
    const users = snapshot.docs.map((doc) => doc.data() as User)
    return users
  }
  return { useAuth, getUser }
}

initializeAppが呼び出される前にgetFirestoreを呼び出すと、No Firebase App '[DEFAULT]' has been createdというエラーが発生します。とのことでした。

先に上記ファイル先がfirebaseの初期化ファイルより先に読まれているからなのかなと思っています。