'typescript: Cannot find module 'react'

I don't understand why it can't find it.

$ cat tsconfig.json

{
  "compilerOptions": {
    "sourceMap": true,
    "target": "es6",
    "jsx": "react",
    "types": [
      "lodash",
      "react",
      "react-dom"
    ]
  }
}

$ tree node_modules/@types

node_modules/@types/
├── lodash
│   ├── README.md
│   ├── index.d.ts
│   ├── package.json
│   └── types-metadata.json
├── react
│   ├── README.md
│   ├── index.d.ts
│   ├── package.json
│   └── types-metadata.json
└── react-dom
    ├── README.md
    ├── index.d.ts
    ├── package.json
    ├── server.d.ts
    └── types-metadata.json

Importing in a component file.

// src/components/component.tsx

import * as React from "react";

What gives?



Solution 1:[1]

if you're not using typescript 2.1, you should upgrade to it. it looks like you're using a 2.x version from the @types you have there.

here is a working tsconfig.json file that i'm using right now:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "moduleResolution": "node",
    "noResolve": false,
    "noImplicitAny": false,
    "removeComments": true,
    "sourceMap": true,
    "allowJs": true,
    "jsx": "react"
  },
  "exclude": [
    "./node_modules/**/*"
  ]
}

it's been a couple days since i resolved the same issue you were having, but i think the key here is the "moduleResolution": "node" and "allowJs": true.

Solution 2:[2]

I had the same issue. You just need to install @types:

npm i -D @types/react

Solution 3:[3]

For resolving the typescript "Cannot find module 'react'", which comes from eslint rules,

You need to install @types/react :

$ npm i -D @types/react

or

$ yarn add -D @types/react

And in your ".eslintrc" file add in extends array the react plugin:

...
extends: [
        'plugin:react/recommended',
        ...  
],

Solution 4:[4]

As on version 2.4.* the responsible config entry of this error (in most of the cases) is:

"compilerOptions": {
          ...
          "moduleResolution": "node" <---------- this entry
          ...
}

Solution 5:[5]

Had the same issue. In my case disabling deno extension solved the problem. It was somehow messing with the imports.

Solution 6:[6]

If you have installed @types/react and it still doesn't work, I recommend that you use a recent version of Typescript and then close your IDE/editor, delete node_modules folder, and run npm install or yarn install and check it again. it should work now.

Solution 7:[7]

At the point in time of writing this comment, I saw an error on my cmd saying that I do not have typescript installed.

npm install typescript

and it did the trick

Solution 8:[8]

Also check to see if your node_modules is present. If it is and you are still experiencing this problem, delete it and reinstall it by running npm install. This solved the problem for me

Solution 9:[9]

I have solved the same issue with types :

npm i -D @types/react or yarn add @types/react

More over my tsconfig.json "jsx" parameter was changing from "react" to "react-jsx" automatically at yarn start. If it can help are is my tsconfig which works for me:

{
  "compilerOptions": {
    "jsx": "react",
    "target": "es6",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "allowJs": true,
    "removeComments": true,
    "sourceMap": true,
    "noResolve": false,
    "noImplicitAny": false
  },
  "include": [
    "src",
    "./node_modules/**/*"
  ]
}

Solution 10:[10]

npm i @types/react or yarn add @types/reactwill solve the issue. The error is occurring due to missing react types

Solution 11:[11]

Delete the node_modulespackage and yarn_lock file (if you have any). Then try a yarn install and restart your VS Code. Worked for me perfectly.

Solution 12:[12]

If you are joining a project that was started by someone else, it is likely that the repo already has the proper devDependencies listed (e.g. @types/react) in package.json. You just need to initiate them with:

npm install