メインコンテンツへスキップ

ローカルライブラリのセットアップ

ローカルライブラリとは、ビューやモジュールを含むライブラリで、あなたのアプリにローカルなものであり、レジストリには公開されません。これは、ローカルライブラリがアプリのネイティブコードから分離されているという点で、ビューやモジュールに対する従来のセットアップとは異なります。

ローカルライブラリはandroid/およびios/フォルダの外側に作成され、オートリンクを使用してアプリと統合されます。ローカルライブラリの構造は次のようになります。

プレーンテキスト
MyApp
├── node_modules
├── modules <-- folder for your local libraries
│ └── awesome-module <-- your local library
├── android
├── ios
├── src
├── index.js
└── package.json

ローカルライブラリのコードはandroid/およびios/フォルダの外にあるため、将来的にReact Nativeのバージョンアップが容易になり、他のプロジェクトにコピーするなども簡単になります。

ローカルライブラリを作成するには、create-react-native-libraryを使用します。このツールには必要なすべてのテンプレートが含まれています。

はじめに​

React Nativeアプリケーションのルートフォルダ内で、以下のコマンドを実行します。

シェル
npx create-react-native-library@latest awesome-module

ここで、awesome-moduleは新しいモジュールに付けたい名前です。プロンプトに従って進むと、プロジェクトのルートディレクトリにmodulesという新しいフォルダが作成され、その中に新しいモジュールが含まれています。

リンク​

デフォルトでは、生成されたライブラリは、Yarnを使用する場合はlink:プロトコル、npmを使用する場合はfile:プロトコルを使用してプロジェクトに自動的にリンクされます。

json
"dependencies": {
  "awesome-module": "file:./modules/awesome-module"
}

これにより、node_modulesの下にライブラリへのシンボリックリンクが作成され、オートリンクが機能するようになります。

依存関係のインストール​

モジュールをリンクするには、依存関係をインストールする必要があります。

シェル
npm install

アプリ内でのモジュールの使用​

アプリ内でモジュールを使用するには、その名前でインポートします。

js
import {multiply} from 'awesome-module';