如何将React 17.0.2/RN 0.68.2项目升级至React 18.2.0/RN 0.74.1并完成Gradle版本升级?
如何将React 17.0.2/RN 0.68.2项目升级至React 18.2.0/RN 0.74.1并完成Gradle版本升级?
兄弟,从RN 0.68.2跨版本升级到0.74.1确实会踩不少版本兼容的坑,尤其是React和Gradle联动升级的部分,我给你梳理一套亲测有效的步骤,帮你把这些问题逐个解决:
一、先靠官方升级工具搞定核心配置
跨大版本升级千万别手动瞎改所有文件,官方工具能帮你省超多事:
- 先把项目代码全提交到Git,避免中途改崩了没法回滚
- 运行命令:
npx react-native upgrade 0.74.1
这个工具会对比RN 0.68和0.74的官方模板文件,自动帮你更新核心配置(比如Android、iOS的项目结构、依赖声明),遇到自定义修改过的文件会提示你手动合并,一定要仔细看差异,别把自己之前加的配置弄丢了
二、同步更新package.json里的核心依赖
- 直接把
react改成"18.2.0",react-native改成"0.74.1" - 别忘了配套升级
react-dom到18.2.0,还有@react-native-community/cli也要换成0.74.x的版本,不然cli命令会和新RN版本冲突 - 运行
npm install或者yarn install(看你平时用哪个包管理器),如果遇到第三方库报错说不兼容RN 0.74,先把这些库暂时注释掉,或者去它们的文档找对应兼容版本,先让核心依赖安装成功再说
三、重点搞定Android端Gradle的版本匹配(你构建失败的核心原因)
Gradle和AGP(Android Gradle Plugin)的版本是强绑定的,乱跳版本肯定崩:
- 先改
android/build.gradle里的classpath:把com.android.tools.build:gradle:7.1.2换成7.4.2,这个是RN 0.74.1官方指定的AGP版本,别直接跳8.0 - 然后改
gradle-wrapper.properties里的distributionUrl:换成https\://services.gradle.org/distributions/gradle-7.5-all.zip
划重点:AGP 7.4.x只能搭配Gradle 7.5-7.6,你之前直接用Gradle 8.0完全不匹配,这是你构建失败的关键! - 再检查
android/app/build.gradle:把compileSdkVersion和targetSdkVersion都升到34(RN 0.74.x要求的最低版本),minSdkVersion至少保留21(如果之前更低,要确认第三方库能兼容) - 最后加Java 17的编译配置(RN 0.74.x默认用Java 17),在
android/build.gradle里的android块下添加:
要是你项目用了Kotlin,记得把Kotlin版本升到1.8.20左右,和Java 17匹配compileOptions { sourceCompatibility JavaVersion.VERSION_17 targetCompatibility JavaVersion.VERSION_17 } kotlinOptions { jvmTarget = '17' }
四、适配React 18的小细节
- React 18的入口在RN项目里不用像Web那样改
createRoot,但要确保没有依赖React 17专属的API(比如某些老状态管理库的用法),如果遇到警告,去对应库的文档找React 18兼容版本 - 要是你想用上React 18的并发渲染特性,得确保所有第三方组件都支持,不然可能会出现奇怪的渲染bug
五、解决构建时的常见错误
- 要是遇到
Could not resolve all files for configuration ':classpath',回去检查Gradle和AGP的版本是不是严格对应(AGP7.4.2→Gradle7.5) - 第三方库报错的话,要么升级库到兼容RN0.74的版本,要么用
patch-package打个临时补丁修改库的代码适配新API - 最后记得清理构建缓存:
cd android && ./gradlew clean,然后再跑./gradlew assembleRelease,很多缓存导致的奇怪版本错误都会消失
六、验证升级成功
- 先跑Debug模式:
npx react-native run-android,确保APP能正常启动,没有红屏错误 - 再打Release APK:
cd android && ./gradlew assembleRelease,能成功生成APK就说明升级基本搞定了
内容来源于stack exchange
相关产品推荐
相关产品推荐

