返回

React Native 0.71 升级 0.73 后 yarn android 运行失败?解决方案详解

Android

React Native 0.71 升级到 0.73 后 yarn android 运行失败的问题解析

不少开发者在将 React Native 从 0.71.11 升级到 0.73.7 后,发现 yarn android 命令无法正常运行,并抛出错误信息,通常指向 MainApplication.kt 文件中的 getPackages 方法。这个问题的出现,是由于新版本的 React Native 调整了原生模块的加载方式,与旧版本的代码产生了冲突。

错误根源探究

编译器给出的错误信息 Return type of 'getPackages' is not a subtype of the return type of the overridden member 已经清晰地表明了问题所在:getPackages 方法的返回值类型与父类定义的类型不匹配。

在 React Native 0.71.11 中,getPackages 方法返回的是 List<ReactPackage> 类型,而 0.73.7 版本要求返回 List<ReactPackage!>?! 符号表示该类型可以为空,而 ? 则表示列表本身可以为空。

另外,错误信息 Type mismatch: inferred type is ArrayList<ReactPackage!>! but List was expected 指出编译器推断出的 getPackages 方法返回值类型为 ArrayList<ReactPackage!>!,与预期的 List 类型不符。

解决方案详解

要解决这个问题,我们需要修改 MainApplication.kt 文件中的 getPackages 方法,使其返回值类型与新版本的 React Native 兼容。

下面提供一种可行的解决方案:

package xxx.xxx

// ... 其他导入语句

class MainApplication : Application(), ReactApplication {

    override val reactNativeHost: ReactNativeHost =
        object : DefaultReactNativeHost(this) {
            override fun getPackages(): List<ReactPackage!>? {
                val packages = PackageList(this).packages
                // 如果有自定义的原生模块,需要在这里添加
                // 例如:packages.add(MyCustomPackage()) 
                return packages
            }

            // ... 其他方法
        }

    // ... 其他方法
}

在这个方案中,我们将 getPackages 方法的返回值类型修改为 List<ReactPackage!>?,并利用 PackageList 获取默认的原生模块列表。

如果你在项目中使用了自定义的原生模块,记得将其添加到 packages 列表中。

其他需要注意的点

除了修改 getPackages 方法,还需要仔细检查 MainApplication.kt 文件中的其他代码,确保它们与新版本的 React Native 兼容。比如,ReactHost.load() 方法可能需要根据你的项目进行调整。

此外,如果你的项目依赖第三方库,也需要检查这些库是否与新版本的 React Native 兼容。如果发现不兼容的情况,可以尝试升级这些库或者寻找替代方案。

常见问题解答

问题 1:修改 getPackages 方法后,仍然报错怎么办?

答:这可能是因为你的项目中还有其他代码与新版本的 React Native 不兼容。建议仔细检查 MainApplication.kt 文件中的其他代码,以及你项目中使用的第三方库。

问题 2:如何检查第三方库是否与新版本的 React Native 兼容?

答:可以查看第三方库的官方文档或者 GitHub 仓库,了解其支持的 React Native 版本。

问题 3:升级 React Native 后,遇到其他问题怎么办?

答:可以参考 React Native 的官方文档,或者在社区论坛寻求帮助。

问题 4:PackageList 是什么?

答:PackageList 是 React Native 0.69 版本引入的一个新特性,用于自动管理原生模块。

问题 5:如何添加自定义的原生模块?

答:可以参考 React Native 的官方文档,了解如何创建和添加自定义的原生模块。

希望这篇文章能帮助你顺利完成 React Native 的升级,并解决 yarn android 运行失败的问题。React Native 的版本更新迭代很快,掌握升级过程中可能遇到的问题和解决方法,能帮助我们更好地使用这个框架进行跨平台开发。