In this tutorial you will learn to fix common errors in ReactJS attempted import error: ‘Switch’ is not exported from react-router-dom.
Let’s get into details on how you can solve this error quickly and why it occurs in the first place.
How Attempted import error: ‘Switch’ is not exported from ‘react-router-dom’ Error Occurs ?
This error usually occurs when you are trying to run your react js application on your computer or on your server.
Attempted import error: 'Switch' is not exported from 'react-router-dom'Quick Fix: Import error: ‘Switch’ is not exported from ‘react-router-dom’ Error
Error: ‘Switch’ is not exported from the ‘react-router-dom’ When attempting to import, this is what you need to do: You only need to downgrade react-router-dom to 5.2.0 in order to accomplish this. First and foremost, simply uninstall react-router-dom.
This command will help you to uninstall react-router-dom: npm uninstall react-router-dom Then, with the help of the following command, install 5.2.0: npm install react-router-dom@5.2.0 Your error must be corrected at this point.
If you are using React-Router-dom v6+, you will notice that the Switch has been replaced with Routes, and you will need to simply import Routes before you can use it as shown in the following example.
import { Routes ,Route } from 'react-router-dom';
You must also update the Route declaration from the previous version.
<Route path='/welcome' element={<Home/>} />
In addition, in react-router-dom, you do not need to use the exact in the Route declaration any longer.
Wrap Up
I hope you were able to fix the issue discussed above, by using the above code. Let me know in the comment section if you are still facing this issue I will be happy to help as soon as possible.
If you liked the above tutorial then please follow us on Facebook and Twitter. Let us know the questions and answer you want to cover in this blog.
Further Read:
