In react authentication app in console showing Error (auth/invalid-api-key)

More Specific Error:-

at createErrorInternal
at assert
at new Auth
at Component.instance.INTERNAL.registerComponent.firebase_component__WEBPACK_IMPORTED_MODULE_2
.Component.setServiceProps.ActionCodeInfo.Operation.EMAIL_SIGNIN [as instanceFactory]
at Provider.getOrInitializeService
at Provider.getImmediate
at FirebaseAppImpl._getService
at FirebaseAppImpl.firebaseAppImpl. [as auth]
at Module../src/firebase.js (firebase.js:27:1)
at Module.options.factory (react refresh:6:1)

Note: For version 9 it’s required to compat/app otherwise showing error also

firebase.js file

import "firebase/compat/auth";

const app = firebase.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_MESSAGING_SENDER_ID ,

appId:process.env.REACT_APP_FIREBASE_APP_ID ,

measurementId:process.env.REACT_APP_FIREBASE_MEASUREMENT_ID
})

export const auth = app.auth();
export default app;

.env.local file:


REACT_APP_FIREBASE_AUTH_DOMAIN=*************
REACT_APP_FIREBASE_DATABASE_URL =*************

REACT_APP_FIREBASE_PROJECT_ID =***************
REACT_APP_FIREBASE_STORAGE_BUCKET =*****************
REACT_APP_FIREBASE_MESSAGING_SENDER_ID =*****************
REACT_APP_FIREBASE_APP_ID =*******************
REACT_APP_FIREBASE_MEASUREMENT_ID =*******************```