6 月 21 日，React Native 0.72 正式發(fā)布！版本增加了 Metro 強烈要求的功能，改進了錯誤處理和其他開發(fā)者體驗方面的改進。其中很多工作都是根據(jù) 2022 年社區(qū)調(diào)查[1]中提供的反饋進行優(yōu)先考慮的。下面就來看看該版本都有哪些更新吧！

亮點

新的 Metro 功能

符號鏈接支持（beta）

符號鏈接支持仍然是 Metro 中最受歡迎的功能之一，在 React Native 0.72 中提供了 beta 版支持。

符號鏈接支持使得 React Native 可以與多倉庫設(shè)置和 pnpm 無縫協(xié)作，消除了臨時解決方案的需求。

包導(dǎo)出支持（beta）

包導(dǎo)出是 package.json 的現(xiàn)代替代方案，為 npm 包定義其公共 API 并針對 React Native 提供新的功能。

通過在 Metro 配置中啟用包導(dǎo)出支持，應(yīng)用將與更廣泛的 JavaScript 生態(tài)系統(tǒng)兼容，包括通過新的 “react-native”社區(qū)條件[2]。

啟用 beta 版功能

要在項目中啟用這些功能，請更新應(yīng)用的 metro.config.js 文件，并設(shè)置 resolver.unstable_enableSymlinks 或 resolver.unstable_enablePackageExports 選項。

module.exports = {
  resolver: {
    unstable_enableSymlinks: true, // 開啟符號鏈接功能
    // or
    unstable_enablePackageExports: true, // 開啟包導(dǎo)功能
  },
};

新的 metro.config.js 設(shè)置

在 React Native 0.72 中，改變了 React Native CLI 中 Metro 的配置加載設(shè)置。需要更新項目中的 metro.config.js 文件，保持與模板版本一致。

這個改動將控制權(quán)移至項目中，使得可以擴展基礎(chǔ)的 React Native Metro 配置，并清理了剩余的默認(rèn)設(shè)置。此外，這意味著獨立的 Metro CLI 命令（例如 metro get-dependencies）現(xiàn)在可以正常工作了。

開發(fā)者體驗改進

不再出現(xiàn)由于無效的樣式屬性而導(dǎo)致的紅色提示框（redbox）

在此版本之前，在 StyleSheet 中提供一個無效的樣式屬性會導(dǎo)致出現(xiàn)紅色提示框（redbox）。這是一個高優(yōu)錯誤，會中斷開發(fā)者的工作流程。

在 0.72 版本中，已經(jīng)放寬了這個預(yù)期，使其能夠默認(rèn)不生效，就像在瀏覽器中提供一個無效的 CSS 屬性一樣，并且更新了類型，以便某些錯誤可以在構(gòu)建時而不是運行時被捕獲。

Hermes 的錯誤信息更易讀

Hermes 在調(diào)用未定義的可調(diào)用對象時增加了更好的錯誤信息。

var x = undefined; x();
// 以前: undefined is not a function
// 現(xiàn)在: x is not a function (it is undefined)

此外，LogBox 的堆棧跟蹤現(xiàn)在會過濾掉與應(yīng)用用戶無關(guān)的內(nèi)部 Hermes 字節(jié)碼幀。

改進了 React Native CLI 的錯誤輸出

0.72 版本搭載了 React Native CLI v11，其中包括改進的功能，以減少重復(fù)、減少冗長的堆棧跟蹤，并在以下命令 init、run-android 和 run-ios 中添加了相關(guān)文檔的鏈接。

Hermes 在大型對象字面量的編譯時間方面進行了改進。

例如，在一個報告的問題 #852[3] 中，用戶將整個數(shù)據(jù)集寫成了一個大型對象字面量。通過改進 Hermes 使用的去重算法，編譯速度提升了97%（221c[4]）。這些改進將有助于需要打包多個對象的應(yīng)用的構(gòu)建時間。

對 JSON 解析進行了多項優(yōu)化，從而使使用 redux-persist 等嚴(yán)重依賴 JSON 操作的庫的應(yīng)用受益。

Hermes 中更多 ECMAScript 支持

• prototype.at 支持 Array、TypedArray 和 String。
• 實現(xiàn)格式良好的 JSON.stringify 以防止格式錯誤的 Unicode 字符串
• 實現(xiàn) AggregateError，它表示包含在單個錯誤中的多個錯誤。對于多個錯誤很有用，例如當(dāng)所有傳遞給它的 promise 都拒絕時，來自 Promise.any() 的錯誤。

對于 JSC 上的用戶，這些功能已經(jīng)可用。

移動新架構(gòu)更新

新架構(gòu)目前處于實驗階段。為了保持更新內(nèi)容的專注性，將把新架構(gòu)的更新放到專門的工作組中，這個變化也將允許更頻繁的更新。

重大變化

刪除已棄用的組件

以下軟件包已從 React Native 0.72 中刪除。請遷移到推薦的社區(qū)包：

• Slider 被 @react-native-community/slider^[5] 取代。
• DatePickerIOS 被 @react-native-community/datetimepicker^[6] 取代。
• ProgressViewIOS 被 @react-native-community/progress-view^[7] 取代。

包重命名

現(xiàn)在，所有從 react-native 核心存儲庫發(fā)布的包都在 react-native/packages 下，并且在 @react-native npm[8] 中發(fā)布，以確保明確的所有權(quán)。

react-native 包沒有任何更改。

如果對重命名的包沒有直接依賴，這個改變不會影響你。否則，在升級到 React Native 0.72 時，將任何重命名的依賴項更新到其 ~0.72 版本。

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

參考資料

[1]2022 年社區(qū)調(diào)查: https://github.com/react-native-community/discussions-and-proposals/discussions/528。

[2]“react-native”社區(qū)條件: 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。