React-Router-Dom V6部署Firebase时遇‘no exported member’错误求助

问题根源 #

你遇到的是react-router-dom类型定义与实际react-router版本不兼容的问题。如果使用的是react-router v6，它移除了大量v5中的API（如Switch、Redirect、withRouter等），但旧的@types/react-router-dom包仍在引用这些已废弃的API，导致TypeScript编译报错。

具体解决步骤 #

1. 确认版本并统一依赖 #

先查看当前安装的版本：

npm list react-router react-router-dom

确保react-router和react-router-dom版本完全一致，且为最新稳定版。如果版本不一致或不是v6，执行以下命令更新：

npm install react-router@latest react-router-dom@latest

2. 移除冗余的类型定义包 #

react-router-dom v6自带类型定义，无需单独安装@types/react-router-dom，如果之前装过，先卸载：

npm uninstall @types/react-router-dom

3. 替换代码中过时的API #

react-router v6和v5的API差异较大，需要修改代码中对应部分：

• 将<Switch>替换为<Routes>
• 将<Redirect>替换为<Navigate>
• 将useHistory钩子替换为useNavigate
• 移除withRouter，v6推荐使用hooks（如useNavigate、useParams）替代，若需兼容类组件，可自行封装简易版withRouter
• match相关逻辑用useMatch或useParams替代

4. 清理缓存并重新构建 #

# 删除依赖和锁文件
rm -rf node_modules package-lock.json
# 重新安装依赖
npm install
# 本地测试构建
npm run build

本地构建成功后，再执行firebase deploy。

5. 检查Firebase函数依赖 #

如果项目包含Firebase Functions，确保functions目录下的package.json依赖版本与根目录一致，避免跨目录的版本冲突。

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