How to stop VS Code importing react methods from Minified React?

Question

At some point, my VS Code has started to import react hooks from react/cjs/react.production.min, not from react.
This annoys me because it only causes errors when I'm developing on my localhost:3000 even with simple hooks such as useState, useEffect, etc.. Is there a way to configure VS Code to import React materials from 'react'? I am tired of manually fixing import statements.
The first pic is the error page I get on Next JS, and the second pic is showing how VS Code automatically imports useState from Minified React. The line above it is the ones I manually fixed.

Gerta

Answer 1

Use:

npm install @types/react -D

Chromyl

Answer 2

maybe you can try to install the Auto Import

https://marketplace.visualstudio.com/items?itemName=steoates.autoimport

or simple reinstall your vscode maybe the fastest way to resolve it

Assignable

Thank you. Auto Import solved the issue! – Gerta

Auto import didn't solve the issue for me! – Ulberto

Answer 3

Following Rivers answer "Auto Import - ES6, TS, JSX, TSX" worked for me since I don't use Typescript.

https://marketplace.visualstudio.com/items?itemName=NuclleaR.vscode-extension-auto-import

Purdy

Answer 4

Apparently, out of nowhere, VS Code started to do the same on my computer -- not suggesting imports from react package. I tried to install Auto Import but it didn't fix the issue. Thinking about it, I recalled the problem started after the IDE suggested using the Workspace's TypeScript version instead of VS Code's. To fix the issue I did the following:

Open the Command Palette

With Cmd+Shift+P or Ctrl+Shift+P, depending on your OS, and enter "typescript". This will bring up a few suggestions.

Change the TypeScript Version

Press the arrow down (↓) until you reach the TypeScript: Select TypeScript Version... option.

This will bring up another modal to select which version you want to use. In my case, I had the Use Workspace Version option selected. Changing it back to Use VS Code's Version did the trick.

I'm not sure exactly why this was happening -- perhaps there are some settings attached to the editor version -- but trying to import things like useState or anything from react package started to work again.

Flywheel

Answer 5

from i use typescript, ide(vscode) start import from react/cjs/react.***.min. i try to install @types/react, then it working fine

Harneen