[리액트] export 'Switch' (imported as 'Switch') was not found in 'react-router-dom' 에러

react-router-dom에서 Switch를 사용하려는데 다음과 같은 에러가 발생했다.

 

원인

React의 버전이 올라가면서 Switch가 Routes로 변경되어 생긴 에러이다.

사용방법은 똑같으니, Switch로 작성했던 부분을 Routes로 변경한다.

 

++) component도 element로 바꾸어주어야 한다!! 중괄호{} 안에 </> 넣는 것도 잊지 말기!

      // v5 버전
      <Switch>
        <Route exacts path="/" component={ChatPage} />
        <Route exact path="/login" component={LoginPage} />
        <Route exact path="/register" component={RegisterPage} />
      </Switch>
      
      
      // v6 버전
      <Routes>
        <Route exacts path="/" element={<ChatPage />} />
        <Route exact path="/login" element={<LoginPage />} />
        <Route exact path="/register" element={<RegisterPage />} />
      </Routes>