yarn add react-router-dom与@types/react-router-dom区别及安装报错问题

这不是react-router-dom的新特性，是版本差异和TypeScript类型适配的问题。你遇到的TS7016错误是TypeScript无法识别react-router-dom包的类型定义导致的，和依赖是否安装成功没有直接关系。

原因说明 #

• react-router-dom v5及更早的版本本身没有内置TypeScript类型声明，为纯JavaScript实现，所以在TS项目中使用必须额外安装@types/react-router-dom来补充类型定义，你单独安装类型包后运行正常就是这个原因。
• 你看到的大多数教程要么是面向JavaScript项目编写（不需要类型声明支持），要么是基于v6+版本的，v6及以后的react-router-dom已经内置了完整的TS类型，不需要额外安装类型包。

排查和解决步骤 #

1. 首先查看项目package.json中react-router-dom的版本号：
   • 若版本低于v6：可以继续使用现有方案，保留react-router-dom和@types/react-router-dom两个依赖即可，也可以升级到v6+版本来避免单独安装类型包。
   • 若版本已经是v6+仍出现该报错，执行以下操作排查：
     • 删除项目根目录的node_modules文件夹和yarn.lock文件，重新执行yarn install安装依赖，解决缓存导致的类型文件缺失问题
     • 检查tsconfig.json的moduleResolution配置项，确保值为node/node16/bundler，避免TS无法正确识别包内置的类型文件
     • 重启Intellij的TypeScript语言服务，清除IDE缓存导致的误报
2. 如果你执行yarn add react-router-dom时本身就提示安装失败，和上述类型报错无关，优先排查yarn镜像源配置、网络连接、本地依赖版本冲突问题。

内容的提问来源于stack exchange，提问作者Dean Schulze