VS Code为何从hoist-non-react-statics的@types/react导入React且报错？

架构老林

2026-10-5

问题现象

近期将React项目迁移至单仓库的/client目录下，在/client目录执行yarn install安装依赖后，VS Code智能提示在导入useEffect、useRef等React Hooks时，会推荐从hoist-non-react-statics/node_modules/@types/react导入，而非从react直接导入，执行yarn start编译时会抛出如下错误：

Module not found: Can't resolve 'hoist-non-react-statics/node_modules/@types/react' in

当前package.json并未将hoist-non-react-statics列为依赖项，依赖配置如下：

"dependencies": {
    "@auth0/auth0-react": "^1.6.0",
    "@hookform/resolvers": "^2.7.1",
    "@reduxjs/toolkit": "^1.6.1",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/jest": "^24.0.0",
    "@types/node": "^12.0.0",
    "@types/qs": "^6.9.7",
    "@types/react": "^16.9.0",
    "@types/react-dom": "^16.9.0",
    "@types/react-redux": "^7.1.7",
    "@types/react-slider": "^1.3.1",
    "@types/react-table": "^7.7.2",
    "clsx": "^1.1.1",
    "final-form": "^4.20.2",
    "final-form-calculate": "^1.3.2",
    "lodash": "^4.17.21",
    "qs": "^6.10.1",
    "rc-checkbox": "^2.3.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-final-form": "^6.5.3",
    "react-hook-form": "^7.12.2",
    "react-redux": "^7.2.4",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.3",
    "react-slider": "^1.3.1",
    "react-table": "^7.7.0",
    "react-truncate": "^2.4.0",
    "typescript": "~4.1.5",
    "yup": "^0.32.9"
  }

修复方案

该问题由React相关的@types类型声明包冲突导致，可选择以下任一方式解决：