React Native 入门（四） - RN 版本升级，从 0.48 升到 0.49 的坑

Z时代
2024-01-10
分类：综合

react

当前 RN 版本：0.49
操作环境：Windows 10

前段时间，facebook 正式发布了 RN 的 0.49 版本，相对于0.48 来说，改动并不是特别大。目前 RN 一个月发布一次新版本，由于越来越稳定，建议把项目一直更新到最新的稳定版，从而能使用到新特性。

React Native 升级流程

首先确保已经安装了 Git，才能进行下面的操作。

1.全局安装 react-native-git-upgrade 模块

在控制台输入以下命令按下回车等待安装完成：

npm install -g react-native-git-upgrade

2.升级项目

在项目目录下输入以下命令按下回车等待安装完成：

react-native-git-upgrade

升级完成后，可以看到以下几个文件发生了改变。RN 的版本则由 0.48.3 升级到了 0.49.3 。

升级后我们直接运行项目，发现是跑不起来的。

3.解决冲突

一般来说，升级跨度的版本越大，出现冲突的几率也就越大。首先要参考官方的更新日志，看看哪里发生了变化，才知道从哪里下手去改。

Release September 2017：https://github.com/facebook/react-native/releases/tag/v0.49.0

升级后需要对以下两个地方做出更改：

(1) 0.49 版本最大的一个变化应该就是将两个平台的入口文件 index.android.js 与 index.ios.js 合并成了一个入口文件 index.js，但是 RN 并不会自动帮你完成这个改变，你需要自己完成这步操作，比如将 index.android.js 重命名为 index.js ，然后把 index.ios.js 删除。正常情况下这一步之后就可以正常编译运行了。

(2) 但是我的项目编译运行会弹出下面的错误：

我们找到对应错误的地方：

由于我在项目里面使用了 Navigator，而这个组件已经被官方弃用了，所以只能通过导入 react-native-deprecated-custom-components 来使用。而通过上面这个包里的源码我们可以发现，它使用了 React.PropTypes，问题正是出在这里。

其实从 React 16.0.0 开始，PropTypes 就已经不再由 React 提供了，而 fb 专门提供了 prop-types 模块，需要通过

import PropTypes from ‘prop-types’

来使用 PropTypes。0.48 版本的 RN 使用的是 16.0.0-alpha.12 版本的 React，alpha 版本还没有移除 PropTypes，所以之前项目不会有任何问题。而到了 0.49版本，自动将 React 升级到了 16.0.0-beta.5，这个版本已经移除了 React.PropTypes，所以再编译就会报错了，因为找不到 PropTypes 了。

而此时我发现 react-native-deprecated-custom-components 这个包还没有更新，为了解决这个问题，我在 package.json 文件里将 React 的版本还原到了 16.0.0-alpha.12，然后执行

npm install

进行重装。完成后编译运行，项目成功启动。

这虽然是一个解决办法，但不建议这么做，以后如果 RN 更新后不再支持 16.0.0-alpha.12 的 React 的话，这种办法自然也就无效了。如果你的老项目使用了 react-native-deprecated-custom-components ，那么建议你继续使用 0.48 版本。新项目的话，赶紧放弃 react-native-deprecated-custom-components 吧！