React + Firebase-无法读取数据库

Question

使用React钩子而不是类组件重写我的项目。

myfile.js

import React, { Component, useState, useEffect } from 'react';
import * as firebase from 'firebase';

const MessageList = () => {

 const [messages, setMessages]   = useState([]);
 const [usernames, setUsernames] = useState('');
 const [contents, setContents]   = useState('');
 const [roomId, setRoomId]       = useState('');

MessageList.messagesRef = MessageList.firebase.database().ref('messages');

useEffect(() => {

  MessageList.messagesRef.on('child added', snapshot => {

  const message = snapshot.val();

  message.key = snapshot.key;

  setMessages([...messages, message]);
 });
}, []);

我遇到module not found: cannot resolve...错误，这很可能是因为我不知道如何导入主App.js文件。

如果我有src/components/myfile.js，如何在我的myfile.js的import语句中添加一个引用，以引用我的App.js文件夹中的src文件？

我不确定这是否是我唯一的问题，因为我之前遇到其他错误。

当前问题

我相信，我的Firebase已经正确连接，并且在此行上收到cannot read property database of undefined：

MessageList.messagesRef = MessageList.firebase.database().ref('messages');