服务器错误类型错误：firebaseApp.firestore 不是 function 错误

Question

Here is my code:

import * as firebase from "firebase/app";
<script src="https://www.gstatic.com/firebasejs/8.7.0/firebase-app.js"></script>
//import "firebase/firestore";
//import {firebase} from 'firebase/app';
import 'firebase/firestore';


const firebaseConfig = {

apiKey: "A*******************",

authDomain: "u*****.com",

projectId: "u******a",

storageBucket: "unl***********.com",

messagingSenderId: "5***********",

appId: "1:5************",

measurementId: "G-"

};

// Initialize Firebase


const firebaseApp =firebase.initializeApp(firebaseConfig);

const db = firebaseApp.firestore();

export { db };

Troubleshooting done so far:

1.Tried importing "import * as firebase from "firebase/app" and import 'firebase/firestore';

2. re-installed npm.

3. deleted nodes and package-lock.json and reinstalled them.

4. Installed firebase and firestore.

Answer 1

You are using Firebase SDK version 9 , the way you import and initialize your Firebase SDK is for older version that's why you are receiving that error.

Use Firebase version 8 or below to still run your current code without any changes. You can change it in package.json or by running the command below:

npm install firebase@8.0.0 --save

the sample dependencies in package.json :

"dependencies": {
    "firebase": "8.0.0",
    "next": "11.1.2",
    "react": "17.0.2",
    "react-dom": "17.0.2"
}

But if you want to use the latest Firebase version 9.0.0 and above which is implementing modular API and you want to adapt the modular API. Use compat packages, in your case, it should be:

import * as firebase from "firebase/compat/app";
import 'firebase/compat/firestore';

Please NOTE :

the compat libraries are a temporary solution that will be removed completely in a future major SDK version ( such as version 10 or version 11 ). Your ultimate goal is to remove compat code and keep only version 9 modular-style code in your app.

Like Dharmaraj's answer , you should upgrade from version 8 to the modular Web SDK.

However I'd recommend upgrading to Modular SDK syntax because has supports tree-shaking and will be lighter than existing version. Checkout this Firecast to learn more about new syntax for Firestore: Getting started with Cloud Firestore for Web