WARN export ‘Switch’ (imported as ‘Switch’) was not found in ‘react-router-dom’

Hello Friends 🙏, today I was setting up a new React project from scratch without using create-react-app and after doing all the required steps when I compiled the React App, I got below warning😮:

So basically it is complaining for the Switch here, below is the code:

Then I did a search on this error and found that in it is due to changes in the v6 of react-router. Then I went to their documentation and found out that now Switch is replaced by Routers. And there are many different changes, you can go through the documentation once if you are using v6 of the react-router.

So I made the change and App started compiling without any warning 🥳.

But now when I went to the browser, I got surprised to see that nothing is rendering 😮.

Then again I went to the documentation and found out that way of writing Route is also changed in v6 😥

Again did the changes and now all is working fine 😅🥳🥳

Thanks 🙏.