我正在写一个react应用程序。我试图从我的常量导出一个图像到我的导航栏，它不会显示出来。我没有看到任何错误信息，它只是显示一个空白屏幕。我确认了网址去的图像。
src/utils/contstants.js

export const Logo = 'https://www.freepnglogos.com/uploads/youtube-logo-hd-8.png';

src/components/Navbar.js

import { Stack } from '@mui/material';
import { Link } from 'react-router-dom';

import { Logo } from '../utils/constants';

const Navbar = () => {
  <Stack
    direction="row"
    alignItems="center"
    p={2}
    sx={{ position: 'sticky', background:'#000',top:0, justifyContent:'space-between'}}
    >
    <Link to="/" style={{ display: 'flex', alignItems:'center'}}>
      <img src={Logo} alt="logo" height={45} />
    </Link>
  </Stack>
}

export default Navbar

App.js

import React from 'react'
import { BrowserRouter, Routes, Route} from 'react-router-dom';
import { Box } from '@mui/material';
import { Navbar, Feed, VideoDetail, ChannelDetail, SearchFeed} from './components';

const App = () => (
    <BrowserRouter>
        <Box>
            <Navbar />
            <Routes>
                <Route path="/" exact element={<Feed />}/>
                <Route path="/video/:id" element={<VideoDetail />}/>
                <Route path="/channel/:id" element={<ChannelDetail />}/>
                <Route path="/search/:searchTerm" element={<SearchFeed />}/>
            </Routes>
        </Box>
    </BrowserRouter>
);

export default App

“但是如果我做了”

return(
     <img src={logo}/>
   )

它的工作原理