在路径中找不到模块：相对于“@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js”的“react/jsx-runtime”答案

【问题标题】：Could not find module in path: 'react/jsx-runtime' relative to '@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js'在路径中找不到模块：相对于“@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js”的“react/jsx-runtime”
【发布时间】：2021-11-23 10:49:50
【问题描述】：

我在使用 MUI 创建新的 React 项目时遇到此错误。我从文档中复制了this 代码示例，该文档适用于他们的实时 Codesandbox，但不适用于我的本地。这是完整的error message：

ModuleNotFoundError
Could not find module in path: 'react/jsx-runtime' relative to '/node_modules/@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js'

下面是我的package.json：

{
  "title": "BasicButtons Material Demo",
  "scripts": {
    "start": "react-scripts start"
  },
  "name": "BasicButtons Material Demo",
  "main": "index.tsx",
  "devDependencies": {
    "react-scripts": "latest"
  },
  "dependencies": {
    "@emotion/react": "11.6.0",
    "@emotion/styled": "11.6.0",
    "@mui/material": "5.1.1",
    "@types/react": "16.14.21",
    "@types/react-dom": "16.9.14",
    "react": "16.12.0",
    "react-dom": "16.12.0",
    "typescript": "4.0.0-beta"
  }
}

【问题讨论】：

标签： javascript reactjs material-ui

【解决方案1】：

根据docs，MUI v5 仅支持 React v17+：

MUI 支持最新版本的 React，从 ^17.0.0（在 React 根目录具有事件委托的版本）开始。查看旧版本的向后兼容性。

出现这个错误的真正原因是react/jsx-runtime 模块只存在于 React v17 中。如果你被 React v15 或 v16 卡住了，你可以更新 react 和 react-dom 到最新的次要版本来修复错误。

将两个包更新到最新版本（17+）以修复它：

npm install react@latest react-dom@latest

如果你必须使用 v16

npm install react@16.14.0 react-dom@16.14.0

如果你必须使用 v15

npm install react@15.7.0 react-dom@15.7.0

【讨论】：