TypeError: (0 , Rt.useState) is not a function

Question

Before marking as duplicate, I've searched a lot and there was no answer.

I'm making a react project. When on development environment, everything works just fine. Then when I build react, there is this error in the browser:

TypeError: (0 , Rt.useState) is not a function at react-dom.production.min.js:209

On the internet I've searched a lot. Everyone would refer to version 16.7 which has no hooks. I have version 16.14 though! Take a look at the dependencies:

{
  "qs": "^6.10.2",
  "react": "^16.14.0",
  "react-content-loader": "^6.1.0",
  "react-dom": "^16.14.0",
  "react-intersection-observer": "^8.33.1",
  "react-qr-reader": "^2.2.1",
  "react-router-dom": "^5.3.0",
  "react-scripts": "5.0.0",
  "react-swipeable-list": "^1.4.0",
  "react-tiger-transition": "^4.1.2",
  "react-toastify": "^8.1.0",
  "react-transition-group": "^4.3.0"
}

I've checked for a duplicate in react. I used npm ls react and npm ls react-dom

Here's the results of these two:

> npm ls react

+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| +-- [email protected]
| | +-- [email protected]
| | | `-- [email protected] deduped
| | `-- [email protected] deduped
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
`-- [email protected]

and the other one:

> npm ls react-dom

+-- [email protected]
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
+-- [email protected]
| `-- [email protected] deduped
`-- [email protected]
  `-- [email protected] deduped

So we can say that there is not a duplicate!

Syntax is probably correct, since it works just fine in development.

I'm so confused. Thank you.

Answer 1

#SOLVED Issue was because vs code intellisense automatically added this :

import { useState } from 'react/cjs/react.development.js'

instead of

import { useState } from 'react'

Killed me to find it :/