简介
React Native 每一次小升级的变动,还是比较容易的,对比一下官方提供的升级助手,就能完成对应的升级,但是如果说你从0.60升级到0.70,中间有很多版本的跨度,这就比较头疼了,这次主要讲的是0.67升级到0.73.4。
一般来说,你照着工具来操作,基本是会多少出现点问题或者是无法兼容的,毕竟每个人搭建的框架以及集成的包是不一样的。
工具
注意: 1. 上面的name,可以填,也不可以不填(反正你填了也没用) 2. 选择当前React Native,和需要升级的版本
升级步骤
升级步骤,主要分为升级React Native,Android,IOS,升级三方包,兼容
React Native 部分
注意,改完React native代码后,需要把node_modules删掉,重新yarn一下。
注意,如果出现以下报错,就
yarn.lock
文件,将所有的“nlark”替换为:“npmmirror”
环境
- node node 版本必须大于等于18
npm install 18
- ruby ruby 版本必须大于等于2.6.10 这边我用的rvm安装的ruby,所以用rvm 重新装了一下,用brew的话,直接
brew install ruby
rvm install ruby-3.2.2 --reconfigure --enable-yjit --with-openssl-dir=$(brew --prefix openssl@3)
- pod 版本升级
pod update
- 三方包升级
yarn upgrade-interactive --latest
package.json
- dependencies
主要升级react,react native,react-use...这些,直接按照工具里直接升级就好了,没有问题。
注意 如果你项目有
react-native-apk-installer-n
、rn-fetch-blob
,那么你需要把这些包移除掉的,这个包已经不兼容了,可以考虑更换成react-native-blob-util
或者其他的。
-
devDependencies
-
这里需要就比较多,按照工具里升级,然后可能会缺失一部分,比如 `eslint-config,metro-config、typescript-config等等。
- resolutions更换成engines,两者不能同时存在。
metro.config.js
这边主要是为了解决yarn dev
启动后,出现无法识别svg、png、jpg等图片。
const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');
const defaultConfig = getDefaultConfig(__dirname);
const {
resolver: { sourceExts, assetExts },
} = getDefaultConfig(__dirname);
const config = {
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: true,
},
}),
},
resolver: {
assetExts: assetExts.filter(ext => ext !== 'svg'),
sourceExts: [...sourceExts, 'svg'],
},
};
module.exports = mergeConfig(defaultConfig, config);
- 无关紧要
下面框出来的地方,是可以直接忽略不用理睬的,不需要做改变。
IOS
- 根据上面的图片,然后修改ios的info、build Settings等文件,修改注意空格之类的
- 修改.m文件到.mm文件到时候,需要双击文件,在文件的右上角进行修改。
Android
android这边太久了,我也忘了遇到什么错了.......