Estoy siguiendo este tutorial de mern stack aquí: https://www.youtube.com/watch?v=ngc9gnGgUdA&list=PL6QREj8te1P7VSwhrMf3D3Xt4V6_SRkhu&ab_channel=JavaScriptMastery

y estoy atascado alrededor de las 33:00

He incrustado los componentes de material-ui/core: contenedor, barra de aplicaciones, tipografía como se especifica con sus atributos, pero no muestra la imagen ni ninguno de los componentes de material-ui/core cuando lo ejecuto.

He probado esto simplemente usando una etiqueta div con la etiqueta de imagen dentro y se muestra bien, así que no estoy seguro de que los componentes material-ui/core no puedan hacerlo. Entonces sé que el problema no es con la imagen o la ruta del archivo de imagen.

se compila bien mostrando solo advertencias para los componentes que no he usado; sin embargo, cuando se muestra en el navegador, no muestra la imagen en absoluto ni ninguno de los componentes material-ui/core.

aquí está mi archivo App.js:

 import React from 'react'; import { Container, AppBar, Typography, Grow, Grid } from '@material-ui/core'; import memories from './images/memories.png' const App = () => { return ( <Container maxWidth="lg"> <AppBar position="static" color="inherit"> <Typography variant="h2" align="center">Memories</Typography> <img src={memories} alt="memories" height="60" width="60" /> </AppBar> </Container> ); }; export default App;

aquí está mi archivo index.js:

 import React from 'react'; import ReactDOM from 'react-dom'; import App from './App' ReactDOM.render(<App />, document.getElementById('root'));

Cualquier ayuda sería muy apreciada y más que feliz de aclarar cualquier cosa :)