Expo项目无法连接React Native Debugger问题求助

开发者阿泽

2026-7-25

Expo + TypeScript 项目无法连接 React Native Debugger 问题排查方案

以下是针对该问题的具体排查和解决步骤：

确认端口一致性
React Native Debugger默认监听8081端口，若Expo项目使用其他端口会导致连接失败。可在项目根目录的app.json或app.config.js中指定打包端口：
```
{
  "expo": {
    "packagerPort": 8081
  }
}
```
修改后重启Expo服务和React Native Debugger，确保两者端口匹配。
强制绑定调试工具
在项目根目录创建.env文件，添加以下配置强制Expo连接指定调试端口：
```
EXPO_DEBUGGER_HOST=localhost:8081
```
也可在启动Expo时直接指定：
```
EXPO_DEBUGGER_HOST=localhost:8081 npx expo start
```
检查TypeScript调试映射配置
确保tsconfig.json中开启sourceMap，否则调试器无法正确解析TypeScript代码：
```
{
  "compilerOptions": {
    "sourceMap": true
  }
}
```
之后运行npx expo start --clear清理缓存，避免旧编译产物干扰。
调整React Native Debugger设置
打开React Native Debugger，通过顶部菜单Debugger -> New Window创建新窗口，确认端口设置为8081；同时关闭其他无关调试窗口，避免端口冲突。
重置Expo调试状态
在Expo开发者菜单中，关闭"Fast Refresh"功能，然后重新开启"Debug Remote JS"，确保未选择Chrome DevTools等其他调试工具。