React 16.14与@types/hoist-non-react-statics类型冲突问题求助

问题根源 #

@types/hoist-non-react-statics@3.3.1 硬依赖了@types/react@18.2.21，而你的项目锁定了@types/react@16.14，两者类型定义存在差异，导致编译时类型检查报错。即使降级react-redux到7.x版本，其依赖的@types/hoist-non-react-statics版本仍可能要求高版本@types/react，冲突依然存在。

npm 解决方案（推荐，npm 8.3+ 支持） #

使用npm的overrides字段强制锁定子依赖版本，步骤如下：

1. 在项目根目录的package.json中添加overrides配置：

{
  "overrides": {
    "@types/hoist-non-react-statics": {
      "@types/react": "^16.14.0"
    }
  }
}

2. 执行命令重新安装依赖：

npm install

原理 #

overrides是npm 8.3版本引入的功能，允许强制指定某个依赖包的子依赖版本，忽略其原本的版本约束。这里我们强制让@types/hoist-non-react-statics使用项目已有的@types/react@16.14版本，直接消除类型冲突。

Yarn 解决方案 #

使用Yarn的resolutions字段锁定子依赖版本，步骤如下：

1. 在项目根目录的package.json中添加resolutions配置：

{
  "resolutions": {
    "@types/hoist-non-react-statics/@types/react": "^16.14.0"
  }
}

2. 执行命令重新安装依赖：

yarn install

原理 #

Yarn的resolutions字段会在依赖安装阶段，强制替换指定路径下的依赖版本，不管依赖树中原本的版本要求。由于@types/react的类型定义在16.x到18.x之间对hoist-non-react-statics这类工具库的适配性良好，强制使用16.14版本不会影响功能运行，仅消除类型冲突。

验证方法 #

依赖安装完成后，执行以下命令检查@types/react的版本是否统一：

# npm 用户
npm ls @types/react

# Yarn 用户
yarn list @types/react

输出结果中所有@types/react的版本都应为16.14.x，之后重新编译项目，类型错误即可消除。

内容的提问来源于stack exchange，提问作者Firecrystal Scribe