26

I have created the project using npm create vite@latest and I choose ts-react, when I ran the script the npm run dev worked, no warning however, I am getting an Cannot find module '@vitejs/plugin-react' or its corresponding type in vite.config.ts in vs code.

Screenshot of error

8 Answers 8

47

Try to restart your VSCode editor

2
  • Yes, I reopened the browser next morning, and the problems were fixed, Commented Mar 5, 2022 at 16:30
  • works, but still... thats frustrating ^^ Commented 2 days ago
18

Restart your TS Server following these steps:

  1. Open Command Palette: Command + Shift + P.
  2. Search TypeScript: Restart TS server.
  3. Press Enter.
1
  • 1
    Yes, that seems to be the issue. Please update the top answer to include all cases that might solve the issue
    – Lucifer
    Commented Apr 19, 2023 at 10:42
16

If you are using SWC!


Use "@vitejs/plugin-react-swc", instead of "@vitejs/plugin-react".

1
  • 1
    That was my case, thanks a lot!!
    – smorollon
    Commented Sep 17, 2023 at 10:59
7

In my case the problem was that I forgot to run yarn in terminal ( or npm install if you use npm) just after initial creation of project ( npm create vite@latest or yarn create vite ). Because vite needs to install all dependencies in package.json and create node_modules folder

6

Cannot find module '@vitejs/plugin-react' or its corresponding type

The question itself is hinting what the issue is. You need to install '@vitejs/plugin-react'. For some reason it doesn't get included when you create a vite project.

If you're using yarn

yarn add @vitejs/plugin-react

if you're using npm

npm i -S @vitejs/plugin-react 
2
  • Yep, this was my problem. I just assumed it would be added when I installed Vite. Don't forget to add vite.config.js as well!
    – Raydot
    Commented Mar 23 at 21:58
  • How did I miss this obvious hint, Good job Commented Jul 3 at 3:35
3

In my case it was that I forgot to install types:

$ npm i -D @types/node

0

All solutions didn't work for me! When I was navigating to the folder:

\node_modules@tanstack\router-plugin\

in my project it showed, that there is no vite.ts file which is very weired.

Copying the vite.ts file from

\node_modules@tanstack\router-plugin\src\

into the parent directory, fixed it for me. Not sure what went wrong during my installation process.

Edit: In the end I copied all files from \src\ since vite.ts has many dependencies

-1

Adding "types": ["vite"] in my tsconfig.json file worked for me.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.