找不到模块：无法解析“react/jsx-runtime”

找不到模块：无法解析 ‘react/jsx-runtime’

Module not found: Can’t resolve ‘react/jsx-runtime’

要解决错误“找不到模块：错误：无法解析‘react/jsx-runtime’”，请确保react通过在项目根目录中打开终端并运行命令
npm install react@latest react-dom@latest并重新启动开发服务器来更新包。

在项目的根目录（package.json
文件所在的位置）中打开终端并运行以下命令：

壳


# 👇️ 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

该命令将更新您的
反应包的版本。

如果您使用 TypeScript，请确保jsx您的文件中的选项设置为. tsconfig.jsonreact-jsx

tsconfig.json文件


{
  "compilerOptions": {
    // 👇️ make sure it's set to react-jsx
    "jsx": "react-jsx"
    // ... rest
  },
  // ... rest
}

当jsx选项设置为时
react-jsx，它会导致编译器发出.jsJSX 更改为
_jsx调用的文件。

如有必要，请确保重新启动开发服务器和 IDE。在您停止并重新运行命令之前，您的开发服务器不会接受更改。 npm start

如果错误未解决，请尝试删除您的node_modules和
package-lock.json（不是package.json）文件，重新运行npm install并重新启动您的 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

如果错误仍然存在，请确保重新启动 IDE 和开发服务器。VSCode 经常出现故障，有时重启可以解决问题。

如果您仍然收到“找不到模块：错误：无法解析‘react/jsx-runtime’”错误，请打开您的package.json文件并确保它包含对象中的react包dependencies。

包.json


{
  // ... rest
  "dependencies": {
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
  },
  "devDependencies": {
    "@types/react": "^18.0.5",
    "@types/react-dom": "^18.0.1",
  }
}

该react模块不应全局安装或位于您的项目中
devDependencies，它应该位于您文件中的dependencies对象中
。package.json

您可以尝试手动添加行并重新运行npm install。

壳


npm install

或者安装最新版本的包：

壳


# 👇️ 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

结论

–