'Switch' is not exported from 'react-router-dom' 에러

공식문서에서 확인해보니 swich 에서 routes로 바꾸란다. ㅡㅡ

한참을 해맸네..

 

-기존

 <Switch>
    <Route path="/login">
        <Login />
    </Route>
    <Route path="/">
        <App />
    </Route>
</Switch>

 

-변경

<Routes>
    <Route path="/login" element={<Login />} />
    <Route path="/" element={<App />} />
</Routes>

Upgrade all <Switch> elements to <Routes>

React Router v6 introduces a Routes component that is kind of like Switch, but a lot more powerful. The main advantages of Routes over Switch are:

• All <Route>s and <Link>s inside a <Routes> are relative. This leads to leaner and more predictable code in <Route path> and <Link to>
• Routes are chosen based on the best match instead of being traversed in order. This avoids bugs due to unreachable routes because they were defined later in your <Switch>
• Routes may be nested in one place instead of being spread out in different components. In small to medium-sized apps, this lets you easily see all your routes at once. In large apps, you can still nest routes in bundles that you load dynamically via React.lazy

In order to use v6, you'll need to convert all your <Switch> elements to <Routes>. If you already made the upgrade to v5.1, you're halfway there.

First, let's talk about relative routes and links in v6.

 

https://reactrouter.com/docs/en/v6/upgrading/v5

React Router | Upgrading from v5