Nu se poate găsi modulul 'firebase' sau declarațiile de tip corespunzătoare. React + TypeScript + Firebase

Am vrut să modific proiectul meu React la care am lucrat în ianuarie pentru a folosi TypeScript. Am instalat toate tipurile și pachetele, singurul fișier care îmi dă probleme este fișierul firebase.

Asta aveam pe atunci folosind js.

import firebase from "firebase";
import "firebase/storage";
import "firebase/auth";
import "firebase/firestore";
import dotenv from "dotenv";

dotenv.config();

const firebaseConfig = {
  apiKey: process.env.API_KEY,
  authDomain: process.env.AUTH_DOMAIN,
  projectId: process.env.PROJECT_ID,
  storageBucket: process.env.STORAGE_BUCKET,
  messagingSenderId: process.env.MESSAGING_SENDER_ID,
  appId: process.env.APP_ID,
  measurementId: process.env.MEASUREMENT_ID,
};
const app =
  firebase.apps.length > 0
    ? firebase.app()
    : firebase.initializeApp(firebaseConfig);

const auth = app.auth();
const db = app.firestore();
const storage = app.storage();
const timestamp = firebase.firestore.FieldValue.serverTimestamp();

const EmailProvider = new firebase.auth.EmailAuthProvider();
const _ = {
  auth,
  db,
  storage,
  timestamp,
  EmailProvider,
};
export default _;

Când trec la TypeScript primesc această eroare când trec cu mouse-ul peste linia import firebase from "firebase"; în VSCode.

Cannot find module 'firebase' or its corresponding type declarations. 

Acesta este fișierul meu package.json și folosesc yarn:

{
  ...
  "private": true,
  "dependencies": {
    ..
    "firebase": "^9.0.0",
    ...
  },
  "scripts": {
 ..
  },
  "eslintConfig": {
   ..
  },
  "browserslist": {
 ..
  },
  "devDependencies": {
    "@types/firebase": "^3.2.1",
    "@types/react-router-dom": "^5.1.8"
  }
}

Răspuns #1

este pentru că importul implicit este din firebase/app și nu din firebase

O zi frumoasă :)

Editare: Nu am observat că foloseai V9 al SDK-ului. Cu această versiune, inițializarea și toată logica cu Firebase nu sunt la fel. Urmează acest ghid pentru a-ți actualiza codul https://firebase.google.com/docs/web/modular-upgrade

Răspuns #2

"firebase": "^9.0.0",
// ...
"@types/firebase": "^3.2.1",

S-ar putea să observați că acestea sunt numere de versiune foarte diferite. Acest lucru se datorează faptului că Firebase vine cu tipuri construite în mod implicit, astfel încât pachetul @types/firebase nu mai este necesar și nu a fost actualizat de 4 ani. Ștergeți "@types/firebase": "^3.2.1", din package.json și rulați din nou yarn