Estoy trabajando en algunos proyectos de reacción y he intentado organizar mi código moviendo algunos componentes a otros archivos y luego importarlos, pero cuando hago eso, solo me da una página en blanco, cuando escribo (importar encabezado de "./ Header") comienza a dar una página en blanco mientras estaba funcionando cuando estaba poniendo todo el código en index.js solamente. este es mi código de índice principal:

 import Header from "./Header" import Footer from "./Footer" import Maincontent from "./Main" function Page(){ return( <div> <Header /> <Maincontent/> <Footer /> </div> ) } ReactDOM.render(<Page/>, document.getElementById("root"))

y este es mi código de encabezado

 export default function Header(){ return( <header> <nav className="nav"> <img src="./react-logo.png" className="img" /> <ul className="nav-items"> <li> Pricing </li> <li> About </li> <li> Contact </li> </ul> </nav> </header> ) }