解决react+ts开发中编辑器找不到react模块的错误

Cannot find module ‘react’ or its corresponding type declarations

要解决“找不到模块react或其对应类型 声明“错误，通过运行 命令 npm install react 和 npm i --save-dev @types/react。

确保通过打开 终端并运行以下命令。react

npm install react react-dom

npm install --save-dev @types/react @types/react-dom

# 或者使用yarn  👇️---------------------------------------------------

yarn add react react-dom

yarn add @types/react @types/react-dom --dev

现在应该能够使用以下代码行导入 react 库。

import React from 'react';

console.log(React);

这应该可以修复错误，现在 TypeScript 应该能够找到 react 库的类型定义。

在tsconfig.json中设置 moduleResolution 为 node

如果这没有帮助，请尝试在 tsconfig.json 文件中设置为 。moduleResolution``node

{
  "compilerOptions": {
    "moduleResolution": "node",
  }
}

您可以在 TypeScript 文档中阅读有关模块的更多信息。classic``node

删除node_modules并重新安装依赖项

如果错误未解决，请尝试删除 和 package-lock.json 文件，重新运行并重新启动 IDE。node_modules``npm install

如果您使用的是 macOS 或 Linux，请执行以下命令。bash``zsh

#   macOS and Linux 系统
rm -rf node_modules
rm -f package-lock.json
rm -f yarn.lock

# 👇️ 清除 npm缓存
npm cache clean --force

# 👇️安装依赖
npm install

如果您使用的是 Windows，请在 CMD 中使用以下命令。

rd /s /q "node_modules"
del package-lock.json
del -f yarn.lock

# 👇️ 清除 npm缓存
npm cache clean --force

# 👇️安装依赖
npm install

确保 重新启动 IDE，然后 开发服务器（如果错误仍然存在）。

您也可以尝试安装最新版本的 React 及其类型。

npm install react@latest react-dom@latest

npm install --save-dev @types/react@latest @types/react-dom@latest

# 使用yarn 👇️---------------------------------------------------

yarn add react@latest react-dom@latest

yarn add @types/react@latest @types/react-dom@latest --dev

如果仍然收到错误，请打开文件并确保 包含对象中的包。package.json``react``dependencies

{
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
  },
  "devDependencies": {
    "@types/react": "^18.0.27",
    "@types/react-dom": "^18.0.10"
  }
}

模块必须位于您的对象中。react``react-dom``dependencies

包必须位于您的对象中。@types/react``@types/react-dom``devDependencies

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

或者安装最新版本的软件包：

# 👇️ 使用 NPM
npm install react@latest react-dom@latest

npm install --save-dev @types/react@latest @types/react-dom@latest

# 使用yarn 👇️ ---------------------------------------------------

yarn add react@latest react-dom@latest

yarn add @types/react@latest @types/react-dom@latest --dev

这些做完,您应该就能解决这个问题了