react native universal monorepo
1.0.0
YARNワークスペースモノレポを使用して、Reactネイティブで複数のプラットフォームをサポートする意見のアプローチ。
アプリで複数のプラットフォームをサポートする予定がある場合は、このアプローチを試す方法と理由に関する詳細なガイドについては、Running React Native Any Anywhereでチェックしてください。
このMonorepoは、YarnワークスペースとTypeScriptを使用して、モジュール式Reactネイティブプロジェクトをサポートしています。
コアのアイデアは、JavaScriptアプリコードをプラットフォーム構成（ネイティブコード + MetroやWebpackなどのアプリバンドラー）から分離することです。
この分離は、さまざまなワークスペースを使用して行われます。JavaScriptアプリコードのappワークスペース、Reactネイティブモバイル構成のmobileワークスペース、Reactネイティブmacos構成のMacOSワークスペースなどがあります。
Yarn nohoist完全に採用して、各プラットフォームで異なるバージョンのReactネイティブを使用して（推奨されますが不要）、新しいReactネイティブアップデートの採用を簡素化します。
NoHoistに感謝します。各プラットフォームワークスペース（ mobile 、 macosなど）は、他のプラットフォームワークスペースが使用しているバージョンに関係なく、Reactネイティブバージョンに依存できます。たとえば、JavaScriptアプリコードが両方のバージョンをサポートしている限り、モバイルアプリとMacOSアプリで[email protected]で[email protected]を使用できます。
このアプローチは、ロックステップの更新に対する徐々に反応のネイティブアップデートを促進します。
詳細については、「Running React Native Everywhere：Yarn Workspaces Monorepoセットアップ」をご覧ください。
ショ和 これがネイティブモノレポスの反応を行う正しい方法だと言っているわけではないことに注意してください。これは、私がより大きなコードベースで使用しているアプローチです:)
このリポジトリをボイラープレートとして使用して、必要のないプラットフォームのワークスペースを削除することも、その仕組みを完全に理解したい場合は、このセットアップをゼロから作成できます。
[email protected]:mmazzarolo/react-native-universal-monorepo.gitcd react-native-universal-monorepo && yarnをインストールしますこのリポジトリをゼロから作成する段階的なチュートリアル：
@thefinnomenonのテレビとnext.next.jsプラットフォームのチュートリアル：
追加のリソース：
開発とビルドコマンド：
yarn android:metro ：Android/iOSのMetro Serverを起動しますyarn android:start ：Androidアプリの開発を開始しますyarn android:studio ：Android StudioでAndroidアプリを開くyarn ios:metro ：Android/iOSのMetro Serverを起動しますyarn ios:start ：iOSアプリの開発を開始しますyarn ios:pods ：IOS Cocoapods依存関係をインストールしますyarn ios:xcode ：XCodeでiOSアプリを開きますyarn macos:metro ：MacOSのMetro Serverを起動しますyarn macos:start ：MACOSアプリの開発を開始しますyarn macos:pods ：MacOS Cocoapods依存関係をインストールしますyarn macos:xcode ：XcodeでMacOSアプリを開きますyarn web:start ：Webアプリの開発を開始しますyarn web:build ：Webアプリの制作ビルドを作成するyarn electron:start ：電子アプリの開発を開始しますyarn electron:package:mac ：MACOSの電子アプリの生産バイナリをパッケージ化するyarn electron:package:win ：Windows用の電子アプリの生産バイナリをパッケージ化するyarn electron:package:linux ：Linuxの電子アプリの生産バイナリをパッケージ化するyarn browser-ext:start ：ブラウザ拡張機能の開発を開始しますyarn browser-ext:build ：ブラウザ拡張機能の制作ビルドを作成するyarn windows:metro ：Windows用のMetro Serverを起動しますyarn windows:start ：Windowsアプリの開発を開始しますyarn tv:android:metro ：Android TVのMetro Serverを開始yarn tv:android:start ：Android TVアプリの開発を開始しますyarn tv:android:studio ：Android StudioでAndroid TVアプリを開くyarn tv:tvos:metro ：TVOSのMetro Serverを起動しますyarn tv:tvos:start ：TVOSアプリの開発を開始しますyarn tv:tvos:xcode ：XcodeでTVOSアプリを開きますyarn tv:tvos:pods ：TVOS Cocoapods依存関係をインストールしますyarn next:start ：next.jsアプリを開始しますyarn next:build ：Build Next.jsアプリyarn next:serve ：next.jsアプリビルドを提供しますその他のコマンド（すべてのワークスペースでこれらのコマンドを実行するには、ウルトラランナーを使用します）：
yarn lintくずyarn lint:fix ：Lint +各プロジェクトを修正しますyarn test ：各プロジェクトのテストを実行しますyarn typecheck ：各プロジェクトでタイプスクリプトタイプチェックを実行するモノレポでネイティブのReactに取り組んでいる間、いくつかのパッケージが巻き上げられたときに正しく機能しないことに気付く - ネイティブにリンクする必要があるか、2回バンドルされてビルドを破壊するため（例： react 、 react-dom ）。
これは、このプロジェクト自体で使用されているアプローチの問題ではありません。 Monoreposの一般的な問題です。
これらの問題を修正するために、それらをノホイストとしてマークするため、それらに依存する各パッケージにインストールされます。
このモノレポでは、 react-native-async-storageのそのようなライブラリの例を見ることができます。
Monorepo全体で使用されるMetro BundlerとWebpackの構成では、ビルドツールのセットを使用して、ノーライストされたパッケージが正しく解決されるようにしています。
それで、これらのライブラリをnohoistリストに追加する限り、あなたは行くのが良いはずですか？
このセットアップをYarn Classicと互換性のあるものにするよう努めていますが、いくつかの微調整を行うと、YARN 2+と互換性があります（すべてのYARN 2+の利点を提供します）。
詳細については、＃22を参照してください。
yarn set version berryを実行します。 .yarnrc.ymlファイルを作成します。.yarnrc.ymlに追加して、各node_modulesスペースですべて作成されていることを確認してください。 nodeLinker : node-modules
nmHoistingLimits : workspacesnmHositingLimits 、各ワークスペースの依存関係をホイストする方法を説明します。 workspacesに設定することにより、すべての依存関係は、ルートフォルダーに掲げるのではなく、各ワークスペースのnode_modulesにインストールされます。つまり、ルートのpackage.jsonのnoHoistセクションを安全にできるようになりました。詳細については、Yarn 2+の「Getsing Start」ガイドをご覧ください。
場合によっては、Yarn Classicは、 react-nativeにpeerDependencyを持つ正確な依存関係を解決することができません。
いくつかの回避策については、＃22を参照してください。 react-native-monorepo-toolsリポジトリの修正が作業中です。
貢献、議論、フィードバックは大歓迎です！新しいPRを送信する前に、機能の変更に関するアクティブな計画があるかどうかを尋ねてください。
