Vite+TS开发React应用执行build时@types/react-router-dom报错如何解决？

错误根因 #

项目中react-router-dom依赖为v6.x版本，而对应的第三方类型声明包@types/react-router-dom为v5.x版本，二者版本不匹配。React Router v6及以上版本官方已内置TypeScript类型定义，不需要额外安装第三方@types声明包，低版本的冗余类型包和v6的实际代码结构冲突，就会触发导出成员不存在的类型报错。
Vite的开发模式默认不执行全量TypeScript类型检查，所以dev运行正常，只有执行tsc做全量类型校验的构建阶段才会抛出错误。

修复步骤 #

• 卸载冗余的低版本类型包
  执行对应包管理工具的卸载命令：

  # npm
  npm uninstall @types/react-router-dom @types/react-router
  
  # yarn
  yarn remove @types/react-router-dom @types/react-router
  
  # pnpm
  pnpm remove @types/react-router-dom @types/react-router
  

• 清理缓存并重新安装依赖（可选，解决缓存残留问题）

  rm -rf node_modules package-lock.json yarn.lock pnpm-lock.yaml
  npm install
  

• 执行构建命令验证修复效果

  npm run build
  

补充说明 #

React Router v6的所有类型都已内置在react-router-dom包中，需要用到相关类型时直接从react-router-dom导入即可，无需从第三方类型包导入。 #

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