'firestore' 未定义 no-undef

Question

我有一个使用 firebase 的新项目。我创建了 2 个文件，

firebase.js

import firebase from "firebase/app";
import "firebase/storage";
import "firebase/firestore";

const firebaseConfig = {
  apiKey: "x",
  authDomain: "x",
  projectId: "x",
  storageBucket: "x",
  messagingSenderId: "x",
  appId: "x",
  measurementId: "x",
};

firebase.initializeApp(firebaseConfig);

export default firebase;

和 App.js

import React, { useEffect, useState, useRef } from "react";
import firebase from "./firebase";

export default function App() {
  const [urlVideo, setUV] = useState();

  useEffect(() => {
    getRoom();
    console.log("TEST");
  }, []);

  const getRoom = async () => {
    firebase
      .firestore()
      .collection("abc")
      .add({
        room: Math.floor(Math.random() * 10000),
        createdAt: firestore.FieldValue.serverTimestamp(),
      })
      .then(() => {
        console.log("Room added!");
      });
  };

  return (
    <div>
      
    </div>
  );
}

当我运行我的项目时，我收到了这个错误。请参考下图。

error

我知道为什么会发生这种情况，因为我之前已经有多个使用 firebase 的项目，并且我已经与另一个项目（代码）进行了比较，发现与我上一个使用 firebase 的项目没有区别。

我正在使用

"firebase": "^8.7.0",

你们能帮帮我吗？非常感谢！

Answer 1

问题来了：

createdAt: firestore.FieldValue.serverTimestamp()
           ^^^^^^^^^

命名空间未在任何地方定义，因此您也必须将其导出。

像这样重构 firebase.js：

if (!firebase.apps.length) {
  firebase.initializeApp(firebaseConfig);
}

const firestoreNamespace = firebase.firestore

export {firebase, firestoreNamespace};

App.js：

import { firebase, firestoreNamespace } from "./firebase"

// Now you can use the namespace like this
createdAt: firestoreNamespace.FieldValue.serverTimestamp()