Borislav Hadzhiev
Last updated: Apr 2, 2022
Photo from Unsplash
To solve the error "Module not found: Error: Can't resolve
'react/jsx-runtime'", make sure to update the react
package by opening your
terminal in your project's root directory and running the command
npm install react@latest react-dom@latest
and restart your dev server.
Open your terminal in your project's root directory (where your package.json
file is located) and run the following commands:
# 👇️ with NPM npm install react@latest react-dom@latest # 👇️ ONLY If you use TypeScript npm install --save-dev @types/react@latest @types/react-dom@latest # ---------------------------------------------- # 👇️ with YARN yarn add react@latest react-dom@latest # 👇️ ONLY If you use TypeScript yarn add @types/react@latest @types/react-dom@latest --dev
The command will update the version of your react package.
jsx
option in your tsconfig.json
file is set to react-jsx
.{ "compilerOptions": { // 👇️ make sure it's set to react-jsx "jsx": "react-jsx" // ... rest }, // ... rest }
When the jsx option is set to
react-jsx
, it causes the compiler to emit .js
files with the JSX changed to
_jsx
calls.
npm start
command.If the error is not resolved, try to delete your node_modules
and
package-lock.json
(not package.json
) files, re-run npm install
and restart
your IDE.
# 👇️ delete node_modules and package-lock.json rm -rf node_modules rm -f package-lock.json # 👇️ clean npm cache npm cache clean --force npm install
If you're still getting the "Module not found: Error: Can't resolve
'react/jsx-runtime'" error, open your package.json
file and make sure it
contains the react
package in the dependencies
object.
{ // ... rest "dependencies": { "react": "^18.0.0", "react-dom": "^18.0.0", }, "devDependencies": { "@types/react": "^18.0.5", "@types/react-dom": "^18.0.1", } }
The react
module should NOT be globally installed or be in your project's
devDependencies
, it should be in the dependencies
object in your
package.json
file.
You can try to manually add the lines and re-run npm install
.
npm install
Or install the latest version of the package:
# 👇️ with NPM npm install react@latest react-dom@latest # 👇️ ONLY If you use TypeScript npm install --save-dev @types/react@latest @types/react-dom@latest # ---------------------------------------------- # 👇️ with YARN yarn add react@latest react-dom@latest # 👇️ ONLY If you use TypeScript yarn add @types/react@latest @types/react-dom@latest --dev