Uncaught Error: useRoutes() may be used only in the context of a <Router> component.

Uncaught Error: useRoutes() may be used only in the context of a <Router> component.

 

App.js에서 Routes를 설정해주었는데, 위에 에러가 발생하였다. 

import { Route, Routes } from 'react-router-dom';

import './App.css';
import Board from './Board';

function App() {
  
  return (
    // <Login />    
    
    <Routes>
        <Route>
          <Route path="/list" element={<Board />} />
        </Route>
    </Routes>

  );
}

export default App;

 

해결 방법은 index.js에 <BrowserRouter>을 추가해주면 된다.

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <BrowserRouter>
    <App />
  </BrowserRouter>
);

reportWebVitals();