这是我第一次在StackOverflow上提问。我是JS和Firebase的新手，我目前正在学习React课程，其中有一部分我必须将Firebase实现到我的“To-do App”中。但我得到了这个错误：

ERROR
_firebase__WEBPACK_IMPORTED_MODULE_1__.default.collection is not a function
TypeError: _firebase__WEBPACK_IMPORTED_MODULE_1__.default.collection is not a function
    at Add (http://localhost:3000/static/js/bundle.js:51:55)
    ...

这是我的firebase.js：

import { initializeApp } from 'firebase/app';
import { getFirestore } from 'firebase/firestore';

const firebaseConfig = {
  ...
};

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

export default db;

db的最初使用是在我的App.js中的Add函数中，我试图在其中向Firestore添加to-dos。

import React, { useState } from 'react';
import db from './firebase';
import { FieldValue } from 'firebase/firestore'; // Importa FieldValue desde 'firebase/firestore', no es necesario importar 'firebase/app'
import './App.css';
import Button from '@mui/material/Button';
import TextField from '@mui/material/TextField';
import Paper from '@mui/material/Paper';
import AddBoxOutlinedIcon from '@mui/icons-material/AddBoxOutlined';
import UpdateIcon from '@mui/icons-material/Update';
import DeleteOutlineOutlinedIcon from '@mui/icons-material/DeleteOutlineOutlined';

function App() {

  const [todos, setTodos] = useState([])
  const [text, setText] = useState('')
  var today = new Date()
  var dateTime = today.getDate() + '-' + (today.getMonth() + 1) + '-' + today.getFullYear() + '    ' + today.getHours() + ':' + today.getMinutes() + ':' + today.getSeconds()

  const Add = (e) => {
    e.preventDefault()
    db.collection('TodoApp').add({
      TODO: text,
      TIME: dateTime,
      SERVERTIMESTAMP: FieldValue.serverTimestamp()
    })
      .then(() => {
        setText('')
        alert('Todo added successfully')
      })
      .catch((error) => {
        alert('Error adding todo', error)
      })
  }

我试图寻找类似的错误，但我还没有找到解决方案。
如果需要，我可以发布更多代码。任何帮助将不胜感激。