React Native引入react-navigation时报getter修改错误如何解决？

错误触发原因 #

你遇到的Attempting to change the getter of an unconfigurable property错误是React Navigation 4.x版本和5.x版本依赖冲突导致的：

• 你的项目同时安装了v4版本的核心包react-navigation@4.4.1，和v5版本的核心包@react-navigation/native、@react-navigation/stack
• 两个大版本的内部实现都会操作同一个全局不可配置属性的getter，v4的初始化逻辑和v5的初始化逻辑发生冲突，就会抛出这个错误
• 你删除react-navigation的import语句后，v4的代码不会执行初始化，冲突消失，错误就会消失

解决方案 #

根据你的开发需求二选一即可：

方案1：完全使用React Navigation 5.x（推荐） #

完全删掉v4版本的所有相关依赖，不要混合使用两个大版本：

1. 执行命令卸载v4核心包：

npm uninstall react-navigation

2. 删除App.js中所有从react-navigation引入的代码，也就是你测试过的那行import { createAppContainer, createSwitchNavigator } from 'react-navigation';
3. v5版本已经移除了createSwitchNavigator，如果需要实现类似的无返回栈导航逻辑，可以用@react-navigation/native提供的navigate、reset方法替代，或者安装适配v5的第三方switch navigator包。

方案2：完全使用React Navigation 4.x #

如果你项目历史代码都是基于v4开发的，不想迁移到v5，可以删除所有v5版本的依赖：

1. 执行命令卸载v5相关包：

npm uninstall @react-navigation/native @react-navigation/stack

2. 删除App.js中所有从@react-navigation开头的包引入的代码，包括NavigationContainer相关逻辑，换成v4版本中用createAppContainer包裹导航器的写法即可。

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