Module Not Found: Can’t Resolve React-Router-Dom [Fixed]

Apply these three quick solutions to resolve the missing module issue

by Abdul Moiz
Abdul Moiz
Abdul Moiz
Abdul Moiz loves technology, fashion, photography, and business. His first love is technology and he loves talking about it. How does he chill? You are most likely to... read more
Affiliate Disclosure
  • The React Router is a full-fledged client-side to server-side routing library for React.
  • React web apps dynamically fetch data instead of refreshing which makes them more user-friendly than other alternatives.
  • The React web apps are faster than traditional page navigation, so make sure to read all the information about it.
react-module can't fix react module dot
A message from our partner

To fix Windows PC system issues, you will need a dedicated tool

  • Download Fortect and install it on your PC
  • Start the tool's scanning process to look for corrupt files that are the source of your problem
  • Right-click on Start Repair so the tool can start the fixing algorithm
Download from Fortect has been downloaded by 0 readers this month, rated 4.4 on TrustPilot

If you are a React programmer who builds web applications, you will need a dedicated router to help your users navigate through them.

But it can sometimes crash and display the message module not found: can’t resolve react-router-dom and you might have no idea as to how to fix it.

Today we’ll help you fix one of the most common errors of the React router. Keep reading to find out!

What is a React Router Dom?

The React Router is a full-fledged client-side to server-side routing library for React. The React Router Dom uses dynamic routing in a web app that helps users navigate efficiently. 

Developers who build React web apps use the React Router Dom to build single-page applications on the web. That is, a web application with many pages or components is never refreshed; rather, content is fetched dynamically.

How we test, review and rate?

We have worked for the past 6 months on building a new review system on how we produce content. Using it, we have subsequently redone most of our articles to provide actual hands-on expertise on the guides we made.

For more details you can read how we test, review, and rate at WindowsReport.

React Router DOM v6 — Part — I. React enables us to develop single-page… |  by Arjun Vaidy | Nerd For Tech | Medium
Source: Medium

The react-router offers a better user experience as it is extremely quick when compared to traditional page navigation and also offers better app performance overall.

Now that you know what routing is and why programmers use React Router Dom, there’s still one thing you should know. There are three types of React Router, and each serves its purpose.

Difference between React Router VS React Dom VS React Native

If you are a React developer, you have three libraries to choose from. All three are almost identical, but they have their use cases. We’ll go over each one of them so you can understand their differences.

  • React-router – Includes all the custom components and features from the react-router-native and react-router-dom libraries.
  • React-router-dom – Mainly used for web applications that are built with React.
  • React-router-native – Built for the React Native framework that is used to create mobile applications using React.

Without further ado, let’s see what you can do if you are getting the module not found error message. Follow along!

What can I do if seeing the error module not found message?

1. Install the dependencies properly

  1. Check if you correctly typed react-router-dom or if you typed react-dom or react dom because the latter two are incorrect.
  2. If the dependencies are not properly installed, use the command react-router-dom to install the dependencies.react router dom error
  3. If the error module is not found: can’t resolve react-router-dom persists even after installing the correct dependency, then try the following commands: npm install react-router-dom --save or npm install -S react-router-domnpm-install module-not-found-cant-resolve-react-router-dom

By using the commands that are mentioned above in the console, you add a dev dependency on your package.json file. This allows you to resolve the error and simultaneously install the dependency on other computers that show module not found: can’t resolve react-router-dom

2. Update the NPM to version 5

  1. To update the NPM to version 5, use the command npm update -gnpm-update module-not-found-cant-resolve-react-router-dom
  2. Confirm now if you are still facing the error module not found: can’t resolve react-router-dom.

Before version 5, NPM by default installed a package under node_modules.

If you are trying to install dependencies for your module/app, you will have to install it and then add it to the dependencies section manually to your package.json.By updating to version 5, you can also resolve issues such as Can’t resolve Axios.

3. Check if you have the correct dependencies installed

  1. Press and hold the Ctrl button and left-click on the react-router-dom word. react-router module-not-found-cant-resolve-react-router-dom
  2. After clicking, you should be redirected to the origin node_modules file of the dependency. If you don’t get redirected, install it again.
  3. You can install it using the command npm install react-router-dom --save or npm install -S react-router-domnpm-install module-not-found-cant-resolve-react-router-dom

The Can’t resolve in the React Router is usually because of improper installation. And this is usually common when you don’t have the correct dependencies installed on the application that you are trying to use.

The React Router helps create web apps by keeping the UI and the URL of your application in sync. These applications are much easier to deploy, run efficiently, and significantly improve the user experience.

But like most things, the React Router can sometimes crash or show an error code, and you can fix it with proper help.

We hope we helped you resolve the error and would love to hear back from you regarding the same in the comments below!

This article covers:Topics: