npm start 했을 때 빈 화면만 나와요 ㅠㅠ 도와주세여 ㅠㅠㅠ

App.js 코드입니다

import './App.css';
import { useState } from 'react';
import img1 from "./img/img1.webp"
import img2 from "./img/img2.webp"
import img3 from "./img/img3.webp"
import {HashRouter as Routes, Route, Link} from "react-router-dom"
import MainPage from './components/MainPage';
import Navbar from './components/Navbar';

function App() {
 
let  = useState([img1,img2,img3])
console.log(img[1])

return (
<div className="App">
<Navbar />
<Routes>
<Route path='/' element={<MainPage />} />
<Route path='/detail' element={<div>상세 페이지임</div>}/>
<Route path='/cart' element={<div>장바구니 페이지임</div>}/>
</Routes>
</div>
 );
}

export default App;

어라 제 코드는 img 라는 변수명이 잘 써져있는데 ..! 복사가 잘 안됬네요 ㅠㅠ

그리고 혹시 라이브러리 문제인가 싶어서 새 프로젝트 깔아서 react-router-dom@6 설치해서 다시 해봤는데 잘 적용이 됩니다 ..

무슨 문제인지 알 수가 없어요 ㅠㅠㅠ 컴포넌트가 너무 많아서 그런 걸까여???

오류도 하나도 안 나고 ,, 콘솔에 찍히는 것도 없고 그냥 진짜 깡통이 되버렸어요 ㅠㅠㅠ