[React] 'Switch' is not exported from 'react-router-dom' - Error

 

 

Swtich를 불러오려 했더니 에러가 떴다.

 

v6부터 Swtich 대신 Routes라고 작성해야 한다고 한다.

추가로 exact component도 elemnt로 바꾸는 걸 권했다.

 

아래 예시를 통해 설명하자면

 

//예전 버전
        <Switch>
          <Route path="/" exact component={<Home />} />
        </Switch>
        
 //v6 버전
        <Routes>
          <Route path="/" element={<Home />} />
        </Routes>

 

Switch를 Routes로 바꾸고,

exact component도 element로 바꾼 걸 확인할 수 있다.

 

import {BrowserRouter as Routes} from "react-router-dom";

당연히 import 부분도 위의 코드처럼

Swtich에서 Routes로 바꿔줘야 한다.

 

import {BrowserRouter as Switch} from "react-router-dom";

위의 코드처럼 Swtich로 작성하면 안된다.