DocsDigest
Back to listLanguage: JA
ClaudeReact NativeJun 21, 2023, 12:00 AM

React Native 0.72 - Symlink Support, Better Errors, and more

A condensed section focused on the key takeaways first.

Original Post
OpenAIClaude

Quick Digest

Summary

A condensed section focused on the key takeaways first.

claudeenmodel: claude-sonnet-4-20250514

React Native 0.72 Release - Symlink Support, Better Errors, and Developer Experience Improvements

react-nativemetrosymlinkshermesdeveloper-experiencebreaking-changespackage-exports

Key Points

  • Beta symlink support for monorepos and pnpm
  • Improved error handling and developer experience
  • Package exports support and Metro enhancements

Summary

React Native 0.72 introduces highly requested Metro features, improved error handling, and enhanced developer experience based on community feedback from the 2022 survey.

Key Points

New Metro Features

  • Symlink Support (Beta): Enables transparent monorepo setups and pnpm compatibility, planned for default enablement in 0.73
  • Package Exports Support (Beta): Modern alternative to package.json "main" field with "react-native" community condition
  • New metro.config.js Setup: Updated configuration format with better control over base Metro config extension

Developer Experience Improvements

  • Relaxed StyleSheet Validation: Invalid style properties now fail silently instead of showing redboxes
  • Better Hermes Error Messages: Improved undefined callable error messages and filtered LogBox stack traces
  • Enhanced CLI Output: React Native CLI v11 with reduced duplication and clearer error messages
  • Performance Improvements: 97% faster compilation for large object literals and optimized JSON parsing in Hermes

ECMAScript Support

  • Added prototype.at support for Array, TypedArray, and String
  • Implemented well-formed JSON.stringify and AggregateError

Breaking Changes

  • Removed Components: Slider, DatePickerIOS, and ProgressViewIOS moved to community packages
  • Package Renames: Core packages moved to @react-native npm scope
  • Configuration Updates: metro.config.js format changes required in 0.73

Migration Notes

  • Use upgrade-helper for migration guidance
  • Update renamed package dependencies to ~0.72 versions
  • Enable beta features via resolver.unstable_enableSymlinks and resolver.unstable_enablePackageExports

Full Translation

Translations

A translation section that keeps the flow of the original article.

claudejamodel: claude-sonnet-4-20250514

React Native 0.72 - Symlink サポート、エラー改善、その他

本日、0.72をリリースします！このリリースでは、Metroの高い要望があった機能、より良いエラーハンドリング、その他の開発者体験の改善が追加されています。この作業の多くは、2022年コミュニティサーベイからのフィードバックを優先して行われました。参加していただいた皆様、ありがとうございました！

ハイライト

新しいMetro機能

Symlinkサポート（ベータ版）

Symlinkサポートは、Metroで最も要望の多い機能の一つであり続けており、React Native 0.72では、ベータサポートを発表できることを嬉しく思います。Symlinkサポートにより、React Nativeはmonorepoセットアップやpnpmと透過的に動作し、回避策の必要性を取り除きます。

アプリで使用するには、Enabling Beta Featuresを参照してください。現在は様々なワークフローでの開発者体験に関するフィードバックを収集するためにベータ版となっています。詳細はこちらをご覧ください。0.73でsymlinksをデフォルトで有効にする予定です。

Package Exportsサポート（ベータ版）

Package Exportsは、package.jsonの"main"フィールドの現代的な代替手段であり、npmパッケージがパブリックAPIを定義し、React Nativeをターゲットにするための新しい機能を提供します。Metro configでPackage Exportsサポートを有効にすることで、新しい"react-native"コミュニティ条件を含む、より広いJavaScriptエコシステムとアプリが互換性を持つようになります。

アプリで使用するには、Enabling Beta Featuresを参照してください。

ヒント: この機能と安定版ロールアウトの計画について詳しく学ぶには、Package Exports Support in React Nativeを参照してください。

ベータ機能の有効化

プロジェクトでこれらの機能を有効にするには、アプリの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ファイルをテンプレートのバージョンに合わせて更新してください。

情報: 設定ファイルを以下の形式に更新してください。upgrade-helperも参照できます。metro.config.jsのこれらの形式変更は0.73で必須になります。0.72では、更新されていない場合に警告をログ出力します。

これにより、ベースのReact Native Metro設定を拡張する制御がプロジェクトに移り、残っていたデフォルト設定をクリーンアップしました。さらに、metro get-dependenciesなどのスタンドアロンMetro CLIコマンドが動作するようになります。

開発者体験の改善

無効なスタイルプロパティでのredboxの廃止

このリリース以前は、StyleSheetで無効なスタイルプロパティを提供するとredboxが表示されていました。これは比較的低リスクなエラーに対して開発者のワークフローを中断する高シグナルエラーでした。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で以下の仕様のサポートが実装されました：

  • Array、TypedArray、Stringのprototype.atサポート。#823（ebe2）を参照
  • 不正なUnicode文字列を防ぐwell-formed JSON.stringifyの実装（d41d）
  • 単一のエラーにラップされた複数のエラーを表すAggregateErrorの実装（9b25）。Promise.any()で渡されたすべてのpromiseが拒否された場合などの複数のエラーに有用

JSCを使用しているユーザーには、これらの機能は既に利用可能です。

New Architectureアップデートの移動

New Architectureは現在実験的です。アップデートをターゲットオーディエンスに焦点を当てるため、0.72および今後のリリースでは、New Architectureアップデートを専用ワーキンググループに移動しています。この変更により、nightlyで出荷される作業など、より頻繁なアップデートも可能になります。

0.72のNew Architectureアップデートはこちらで読むことができます。

New Architectureの進捗について最新情報を得るには、ワーキンググループのGitHub通知を購読してください。

破壊的変更

非推奨コンポーネントの削除

以下のパッケージは0.72でReact Nativeから削除されました。推奨されるコミュニティパッケージに移行してください：

  • Sliderは@react-native-community/sliderに置き換えられました
  • DatePickerIOSは@react-native-community/datetimepickerに置き換えられました
  • ProgressViewIOSは@react-native-community/progress-viewに置き換えられました

パッケージ名の変更

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をお読みください。

謝辞

このリリースの多くは、コミュニティからの直接的なフィードバックから生まれました。ノイジーなredboxの報告、Package Exportsのバグ、New Architectureのベンチマークなど、すべてが貴重な情報であり、フィードバックを共有するのに時間を割いていただいたことに感謝しています。

0.72には66人の貢献者による1100以上のコミットが含まれています。皆様のハードワークに感謝します！

0.72へのアップグレード

upgrade-helperで必要な変更のリストを確認するか、既存のプロジェクトを更新する方法についてはアップグレードドキュメントを読むか、npx react-native@latest init MyProjectで新しいプロジェクトを作成してください。

Expoを使用している場合、React Nativeバージョン0.72はExpo SDK 49リリースでサポートされます。

情報: 0.72は現在React Nativeの最新安定版であり、0.69.xバージョンはサポート対象外になりました。詳細については、React Nativeのサポートポリシーを参照してください。