Solution for the error “Cannot find module ‘react'” in TypeScript

In this article, we talk about the error “Cannot find module ‘react'” in TypeScript. We will show you how to install the ‘react’ module along with the type definitions of this module to fix this problem. Check out the information below for detailed instructions.

The reason why you get this error

While working on a TypeScript project, you will likely receive the error message “Cannot find module ‘react” when you import the React module in your file.

The reason you have this problem is that the ‘react’ module is not installed in your project. This is a fairly common error when the user has not installed the required module.

To illustrate, here is an example of how the error occurred.

As soon as you import the ‘react’ module into the file, you will see an error message appear.

How to solve error “Cannot find module ‘react'” in TypeScript?

We will show you how to install the ‘react’ module to fix this problem.

Open a terminal in the root directory of your project and start to install the ‘react’ module by running the following commands:

npm install react
npm install --save-dev @types/react

Now, it looks like the error has been solved. You can import the ‘react’ module with the import statement below:

import React from 'react';

console.log(React);

If the error persists, open your tsconfig.json file and try to set the ‘moduleResolution’ option to ‘node’. At this point, your tsconfig.json file will look like this:

{
  "compilerOptions": {
    "moduleResolution": "node",
    //other settings…
  }
}

For more information about the ‘node’ and ‘classic’ module resolution, you can check out the TypeScript docs.

If the above approach does not help, try removing your package-lock.json and node_modules files, then re-execute the ‘npm install’ command. 

rm -rf node_modules package-lock.json
npm install

Keep in mind to restart your IDE after finishing executing the above commands.

It would be best if you restarted the IDE to ensure the latest updates are caught up. For example, VSCode crashes frequently, and sometimes a restart solves things.

Summary

In conclusion, we just showed you how to solve the error “Cannot find module ‘react'” in TypeScript. Please make sure you have installed the ‘react’ module along with the type definitions of this module before you start using it to avoid unexpected errors. That’s the end of this post. We hope the information in this article is helpful to you.

Maybe you are interested:

• Cannot find module ‘ts-node/register’ in TypeScript
• “Cannot find module ‘fs/promises’” in TypeScript
• Cannot find module ‘react/jsx-runtime’ or its corresponding type declarations – How to solve this error?

Christopher

My name’s Christopher Gonzalez. I graduated from HUST two years ago, and my major is IT. So I’m here to assist you in learning programming languages. If you have any questions about Python, JavaScript, TypeScript, Node.js, React.js, let’s contact me. I will back you up.

Name of the university: HUST
Major: IT
Programming Languages: Python, JavaScript, TypeScript, Node.js, React.js