首次运行Expo React Native项目遇报错,如何解决?
问题
首次创建基于Expo的React Native项目,执行npm start启动时遇到无法自行解决的报错;尝试手动安装react-native@0.71.4版本时,又触发另一处依赖冲突报错。
项目package.json内容
{ "scripts": { "start": "expo start", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web" }, "dependencies": { "axios": "^1.3.4", "expo": "^48.0.7", "expo-constants": "~14.2.1", "expo-font": "^11.1.1", "expo-linking": "~4.0.1", "expo-router": "^1.2.0", "expo-splash-screen": "~0.18.1", "expo-status-bar": "~1.4.2", "react": "18.2.0", "react-dom": "18.2.0", "react-native": "0.71.4", "react-native-dotenv": "^3.4.8", "react-native-gesture-handler": "~2.9.0", "react-native-reanimated": "~2.14.4", "react-native-safe-area-context": "4.5.0", "react-native-screens": "~3.20.0", "react-native-web": "~0.18.7" }, "devDependencies": { "@babel/core": "^7.19.3", "@babel/plugin-proposal-export-namespace-from": "^7.18.9" }, "resolutions": { "metro": "^0.73.7", "metro-resolver": "^0.73.7" }, "overrides": { "metro": "^0.73.7", "metro-resolver": "^0.73.7" }, "name": "reactnativejs", "version": "1.0.0", "private": true }
报错截图
- 执行
npm start时的报错:
- 安装
react-native@0.71.4时的报错:
解决方案
1. 解决安装react-native时的依赖冲突
Expo的每个SDK版本都绑定了固定的react-native版本,Expo 48对应的就是0.71.4,手动安装会触发依赖冲突,无需单独操作。具体步骤:
- 删除项目根目录下的
node_modules文件夹和package-lock.json文件 - 从package.json的
dependencies中移除"react-native": "0.71.4"(Expo会自动管理该依赖) - 执行
npm install重新安装所有依赖
2. 解决npm start时的metro解析报错
截图显示metro模块解析失败,你配置的metro版本0.73.7和Expo 48不兼容,正确对应版本为0.73.9。调整步骤:
- 修改package.json中的
resolutions和overrides配置:
"resolutions": { "metro": "^0.73.9", "metro-resolver": "^0.73.9" }, "overrides": { "metro": "^0.73.9", "metro-resolver": "^0.73.9" }
- 再次删除
node_modules和锁文件,执行npm install - 执行
npm start --clear清除metro缓存后重新启动项目
额外提示
- 用Expo开发时,永远不要手动修改react-native版本,强行调整会引发连锁兼容性问题
- 若后续
expo-router出现异常,可尝试重新安装对应版本:npm install expo-router@^1.2.0
内容的提问来源于stack exchange,提问作者Abrham_m
相关产品推荐
相关产品推荐

