Как настроить переадресацию между страничками на локале

Есть несколько файлов страниц

При открытии их на локалхосте открывается лишь одна, независимо от URL, вот как выглядит app.tsx:

import logo from './logo.svg';
import './App.css';
import MainPage from "./pages/main_page";
import SignIn from "./pages/SignIn";
import SignUp from "./pages/SignUp";
import UserPreferences from "./pages/UserPreferences";
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'

function App() {

    return (
        <Router>
            <Routes>
                <Route path='/' element={<SignIn />} />
                <Route path='/SignUp' element={<SignUp />} />
                <Route path='/Preferences' element={<UserPreferences />} />
                <Route path='/MainPage' element={<MainPage />} />
            </Routes>
        </Router>
    );
}

export default App;

По идее при запуске аппки должна запускаться страничка SignIn, а при изменении URL, например на http://localhost:3000/Preferences, открываться страничка UserPreferences, но по факту открывается и остается несменной страничка MainPage.

В чем может быть проблема? Если нужно, то приложу ссылку на ветку на гите: https://github.com/Danylo2077/ElGen_2024/tree/front