• React Native 0.72 正式发布 新版本有哪些更新?
  • 发布于 2个月前
  • 706 热度
    0 评论
  • 王晶
  • 0 粉丝 41 篇博客
  •   
6 月 21 日,React Native 0.72 正式发布!版本增加了 Metro 强烈要求的功能,改进了错误处理和其他开发者体验方面的改进。其中很多工作都是根据 2022 年社区调查[1]中提供的反馈进行优先考虑的。下面就来看看该版本都有哪些更新吧!

亮点
1.新的 Metro 功能
2.符号链接支持(beta
符号链接支持仍然是 Metro 中最受欢迎的功能之一,在 React Native 0.72 中提供了 beta 版支持。符号链接支持使得 React Native 可以与多仓库设置和 pnpm 无缝协作,消除了临时解决方案的需求。

2.包导出支持(beta)
包导出是 package.json 的现代替代方案,为 npm 包定义其公共 API 并针对 React Native 提供新的功能。通过在 Metro 配置中启用包导出支持,应用将与更广泛的 JavaScript 生态系统兼容,包括通过新的 “react-native”社区条件[2]。

3.启用 beta 版功能
要在项目中启用这些功能,请更新应用的 metro.config.js 文件,并设置 resolver.unstable_enableSymlinks 或 resolver.unstable_enablePackageExports 选项。
module.exports = {
  resolver: {
    // 堆代码 duidaima.com
    unstable_enableSymlinks: true, // 开启符号链接功能
    // or
    unstable_enablePackageExports: true, // 开启包导功能
  },
};
4.新的 metro.config.js 设置
在 React Native 0.72 中,改变了 React Native CLI 中 Metro 的配置加载设置。需要更新项目中的 metro.config.js 文件,保持与模板版本一致。

这个改动将控制权移至项目中,使得可以扩展基础的 React Native Metro 配置,并清理了剩余的默认设置。此外,这意味着独立的 Metro CLI 命令(例如 metro get-dependencies)现在可以正常工作了。

开发者体验改进
1.不再出现由于无效的样式属性而导致的红色提示框(redbox)
在此版本之前,在 StyleSheet 中提供一个无效的样式属性会导致出现红色提示框(redbox)。这是一个高优错误,会中断开发者的工作流程。

在 0.72 版本中,已经放宽了这个预期,使其能够默认不生效,就像在浏览器中提供一个无效的 CSS 属性一样,并且更新了类型,以便某些错误可以在构建时而不是运行时被捕获。

2.Hermes 的错误信息更易读
Hermes 在调用未定义的可调用对象时增加了更好的错误信息。
var x = undefined; x();
// 以前: undefined is not a function
// 现在: x is not a function (it is undefined)
此外,LogBox 的堆栈跟踪现在会过滤掉与应用用户无关的内部 Hermes 字节码帧。

3.改进了 React Native CLI 的错误输出
0.72 版本搭载了 React Native CLI v11,其中包括改进的功能,以减少重复、减少冗长的堆栈跟踪,并在以下命令 init、run-android 和 run-ios 中添加了相关文档的链接。

Hermes 在大型对象字面量的编译时间方面进行了改进。
例如,在一个报告的问题 #852[3] 中,用户将整个数据集写成了一个大型对象字面量。通过改进 Hermes 使用的去重算法,编译速度提升了97%(221c[4])。这些改进将有助于需要打包多个对象的应用的构建时间。

对 JSON 解析进行了多项优化,从而使使用 redux-persist 等严重依赖 JSON 操作的库的应用受益。

4.Hermes 中更多 ECMAScript 支持
prototype.at 支持 Array、TypedArray 和 String。
实现格式良好的 JSON.stringify 以防止格式错误的 Unicode 字符串
实现 AggregateError,它表示包含在单个错误中的多个错误。对于多个错误很有用,例如当所有传递给它的 promise 都拒绝时,来自 Promise.any() 的错误。
对于 JSC 上的用户,这些功能已经可用。

5.移动新架构更新
新架构目前处于实验阶段。为了保持更新内容的专注性,将把新架构的更新放到专门的工作组中,这个变化也将允许更频繁的更新。

重大变化
1.删除已弃用的组件
以下软件包已从 React Native 0.72 中删除。请迁移到推荐的社区包:

Slider 被 @react-native-community/slider[5] 取代
DatePickerIOS 被 @react-native-community/datetimepicker[6] 取代
ProgressViewIOS 被 @react-native-community/progress-view[7] 取代
2.包重命名
现在,所有从 react-native 核心存储库发布的包都在 react-native/packages 下,并且在 @react-native npm[8] 中发布,以确保明确的所有权。react-native 包没有任何更改。图片如果对重命名的包没有直接依赖,这个改变不会影响你。否则,在升级到 React Native 0.72 时,将任何重命名的依赖项更新到其 ~0.72 版本。

官方更新文档:  https://reactnative.dev/blog/2023/06/21/0.72-metro-package-exports-symlinks

参考资料
[1]2022 年社区调查: https://github.com/react-native-community/discussions-and-proposals/discussions/528
[2]“react-native”社区条件: https://nodejs.org/docs/latest-v19.x/api/packages.html#community-conditions-definitions
[3]#852: https://github.com/facebook/hermes/issues/852
[4]221c: https://github.com/facebook/hermes/commit/221ce21a209e2e32a3eaaa2d9e28ca81842fad20
[5]@react-native-community/slider: @react-native-community/slider
[6]@react-native-community/datetimepicker: https://github.com/react-native-datetimepicker/datetimepicker
[7]@react-native-community/progress-view: https://github.com/react-native-progress-view/progress-view
[8]@react-native npm scope: https://www.npmjs.com/search?q=%40react-native
用户评论