跳至主要內容

React Native 0.72 - Symlink 支援、更佳錯誤訊息以及更多

·6 分鐘閱讀時間
Lorenzo Sciandra
Lorenzo Sciandra
Microsoft 資深軟體工程師
Marek Fořt
Marek Fořt
Shopify 軟體工程師
Riccardo Cipolleschi
Riccardo Cipolleschi
Meta 軟體工程師
Luna Wei
Luna Wei
Meta 軟體工程師

今天我們發布 0.72！

此版本為 Metro 新增了高度要求的功能、更佳的錯誤處理，以及其他開發人員體驗改進。這項工作的絕大部分優先順序來自您在2022 年社群調查中的意見回饋 -- 感謝所有參與者！

重點功能​

重大變更​

重點功能​

全新 Metro 功能​

Symlink 支援一直是 Metro 中最受歡迎的功能之一，在 React Native 0.72 中，我們很高興宣布對其提供 Beta 支援。

Symlink 支援讓 React Native 能夠以透明方式處理 monorepo 設定和 pnpm，無需使用變通方法。請參閱啟用 Beta 功能，以在您的應用程式中使用。

目前處於 Beta 階段，旨在收集關於開發人員在不同工作流程中的體驗回饋，請參閱此處以了解更多詳細資訊。我們計畫在 0.73 中預設啟用 symlink。

套件匯出支援 (Beta)​

套件匯出是 package.json "main" 欄位的現代替代方案，並為 npm 套件提供了定義其公開 API 和鎖定 React Native 的新功能。

透過在您的 Metro 設定中啟用套件匯出支援，您的應用程式將與更廣泛的 JavaScript 生態系統相容，包括透過新的 "react-native" 社群條件。請參閱啟用 Beta 功能，以在您的應用程式中使用。

提示

請參閱React Native 中的套件匯出支援，以深入了解此功能以及我們針對穩定推出的計畫。

啟用 Beta 功能​

若要在您的專案中啟用這些功能，請更新您應用程式的 metro.config.js 檔案，並設定 resolver.unstable_enableSymlinks 或 resolver.unstable_enablePackageExports 選項。

const config = {
  // ...
  resolver: {
    unstable_enableSymlinks: true,
    unstable_enablePackageExports: true,
  },
};

全新 metro.config.js 設定​

在 React Native 0.72 中，我們已變更 React Native CLI 中 Metro 的設定載入設定。請更新您專案的 metro.config.js 檔案，以符合範本的版本。

資訊

請將您的設定檔更新為以下格式。您也可以遵循升級助手。

metro.config.js 的這些格式變更將在 0.73 中成為必要。對於 0.72，若未更新，我們將記錄警告。

這會將擴充基本 React Native Metro 設定的控制權移至您的專案中，並且我們已清理剩餘的預設值。此外，這表示獨立的 Metro CLI 命令 (例如 metro get-dependencies) 現在將可運作。

開發人員體驗改進​

不再因無效樣式屬性而出現紅框​

在此版本之前，在 StyleSheet 中提供無效的樣式屬性會導致出現紅框。這是一個高訊號錯誤，會中斷開發人員的低風險錯誤工作流程。

在 0.72 中，我們已放寬此預期，使其像在瀏覽器中提供無效的 CSS 屬性一樣，以靜默方式失敗，並已更新類型，以便在建置時而非執行時捕獲某些錯誤。

更佳的 Hermes 錯誤可讀性​

Hermes 在調用未定義的可調用項時新增了更佳的錯誤訊息。

    var x = undefined; x();
    // Before: undefined is not a function
    // After: x is not a function (it is undefined)

此外，LogBox 堆疊追蹤現在會篩選出與應用程式使用者無關的內部 Hermes 位元組碼框架。

改進 React Native CLI 的錯誤輸出​

0.72 隨附 React Native CLI v11，其中包括改進，以減少重複、釐清措辭、減少冗長堆疊追蹤，並在以下命令 init、run-android 和 run-ios 中新增相關文件的深層連結。

您可以在React Native CLI 變更記錄中找到其他改進。

Hermes 中更快速的編譯和 JSON 剖析​

Hermes 已改進大型物件常值的編譯時間。例如，在一個報告的問題 #852 中，使用者將整個資料集寫成大型物件常值。透過改進 Hermes 使用的重複資料刪除演算法，編譯速度提高了 97% (221c)。這些改進將有益於捆綁許多物件的應用程式的建置時間。

JSON 剖析的多項最佳化 (de9c、6e2d) 也已實作，這有益於使用 redux-persist 等嚴重依賴 JSON 操作的程式庫的應用程式。

Hermes 中更多 ECMAScript 支援​

在 React Native 0.72 中，Hermes 中已實作以下規格

對於 JSC 的使用者，這些功能已可使用。

New Architecture 更新進展​

New Architecture 目前處於實驗階段。為了讓更新專注於其目標受眾，我們將 0.72 和未來版本中的 New Architecture 更新移至專用的工作群組。此變更也將允許更頻繁的更新，例如在我們的每夜建置中發布的工作。

您可以在此處閱讀 New Architecture 的 0.72 更新。訂閱工作群組 GitHub 通知，以隨時掌握我們在 New Architecture 上的進度。

重大變更​

已棄用組件移除​

以下套件已從 React Native 0.72 中移除。請遷移至建議的社群套件

套件重新命名​

從 react-native 核心儲存庫發布的所有套件現在都位於 react-native/packages 下，並在 @react-native npm 範圍下發布，以確保明確的所有權。

對 react-native 套件沒有任何變更。

舊套件名稱新套件名稱
@react-native-community/eslint-config@react-native/eslint-config
@react-native-community/eslint-plugin@react-native/eslint-plugin
@react-native/polyfills@react-native/js-polyfills
@react-native/normalize-color@react-native/normalize-colors
@react-native/assets@react-native/assets-registry
react-native-codegen@react-native/codegen
react-native-gradle-plugin@react-native/gradle-plugin

如果您沒有直接依賴重新命名的套件，則此變更不會影響您。否則，在升級到 React Native 0.72 時，請將任何重新命名的依賴項更新為其 ~0.72 版本。

您可以在專用 RFC 中閱讀導致這些變更的動機。

致謝​

此版本的許多內容來自社群的直接意見回饋。從關於吵雜紅框、套件匯出錯誤、New Architecture 基準的報告 — 所有這些意見回饋都很有價值，我們感謝您花時間分享意見回饋。

0.72 包含來自 66 位貢獻者的超過 1100 次提交。感謝您的辛勤工作！

升級至 0.72​

查看升級助手中所需變更的清單，或閱讀升級文件，以了解如何更新現有專案，或使用 npx react-native@latest init MyProject 建立新專案。

如果您使用 Expo，Expo SDK 49 版本將支援 React Native 0.72 版本。

資訊

0.72 現在是 React Native 的最新穩定版本，0.69.x 版本現在移至不受支援。如需更多資訊，請參閱React Native 的支援政策。