Reactとfirebaseを使ってTodoアプリを作っていたところ、firebaseが定義されていないというエラーが出てしまう。

Question

解決したいこと

ここに解決したい内容を記載してください。
ReactとfirebaseでTodoアプリを作っていたところ、
以下のようなエラーが出て対処できません。

発生している問題・エラー

Failed to compile
./src/service/firebase.js
Module not found: Can't resolve 'firebase' in 'C:\Users\ayasaka\source\todo\src\service'

該当するソースコード

import { initializeApp } from "firebase"
import { getAuth, signInWithPopup, GoogleAuthProvider, signOut } from "firebase/auth";
import { getFirestore } from "firebase/firestore";

const app = initializeApp({
   apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
   authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
   databaseURL: process.env.REACT_APP_FIREBASE_DATABASE_URL,
   projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
   storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
   messagingSenderId: process.env.REACT_APP_FIREBASE_SENDER_ID,
   appId: process.env.REACT_APP_FIREBASE_APP_ID,
   measurementId: process.env.REACT_APP_FIREBASE_MEASUREMENT_ID,
});

const provider = new GoogleAuthProvider();

export const auth = getAuth();
export const db = getFirestore(app);
export const signInwithGoogle = () => {
   signInWithPopup(auth, provider)
      .then((res) => {
      console.log(res.user);
      })
      .catch ((error) => {
      console.log(error.message);   
   });
}
export const logOut = () => {
   signOut(auth).then(() => {
      console.log("logout out");
      document.location.reload();
   })
   .catch((error) => {
      console.log(error.message);
   });
}

自分で試したこと

ここに問題・エラーに対して試したことを記載してください。
firebaseの読み込みが間違っているという情報があったので、直してみましたができませんでした。

Comments

[退会済みユーザー]

あ、の。
npm install --save firebase だったり yarn add firebase だったりをやってないとか、そないな話とはちゃうねんな？