라우터에서 빈 화면 나오시는 분들

Switch 문이 버전 6에서 사라졌다고 하네요. Route에서 props로 element 보내는 방법을 사용해서 코드를 수정해보았습니다. 참고하시면 좋을 거 같아요. 

import { BrowserRouter as Router, Routes, Route } from "react-router-dom"
import NavBar from "./components/views/NavBar/NavBar";
import Footer from "./components/views/Footer/Footer";
import LandingPage from "./components/views/LandingPage/LandingPage";
import LoginPage from "./components/views/LoginPage/LoginPage";
import RegisterPage from "./components/views/RegisterPage/RegisterPage";

function App() {
    return (
        <>
            <NavBar />
            <Router>
                <Routes>
                    <Route path="/" element={<LandingPage />} />
                    <Route path="/login" element={<LoginPage />} />
                    <Route path="/register" element={<RegisterPage />} />
                </Routes>
            </Router>
            <Footer />
         </>
    );
}

export default App;