ライブラリの使用
React Nativeには、アプリですぐに使える組み込みのコアコンポーネントとAPIのセットが用意されています。React NativeにバンドルされているコンポーネントとAPIに限定されるわけではありません。React Nativeには数千人の開発者コミュニティがあります。コアコンポーネントとAPIに探しているものがない場合でも、コミュニティからライブラリを見つけてインストールし、アプリに機能を追加できる可能性があります。
パッケージマネージャーの選択
React Nativeライブラリは通常、npm CLIやYarn ClassicなどのNode.jsパッケージマネージャーを使用してnpmレジストリからインストールされます。
コンピュータにNode.jsがインストールされている場合、npm CLIはすでにインストールされています。一部の開発者は、インストール時間の短縮とワークスペースなどの追加の高度な機能のためにYarn Classicを使用することを好みます。どちらのツールもReact Nativeでうまく機能します。このガイドの残りの部分では、説明を簡素化するためにnpmを前提とします。
💡 JavaScriptコミュニティでは、「ライブラリ」と「パッケージ」という用語は同じ意味で使用されます。
ライブラリのインストール
プロジェクトにライブラリをインストールするには、ターミナルでプロジェクトディレクトリに移動し、インストールコマンドを実行します。react-native-webview
で試してみましょう。
- npm
- Yarn
npm install react-native-webview
yarn add react-native-webview
インストールしたライブラリにはネイティブコードが含まれているため、使用する前にアプリにリンクする必要があります。
iOSでのネイティブコードのリンク
React NativeはCocoaPodsを使用してiOSプロジェクトの依存関係を管理しており、ほとんどのReact Nativeライブラリはこの慣例に従っています。使用しているライブラリがこの慣例に従っていない場合は、追加の手順についてはREADMEを参照してください。ほとんどの場合、以下の手順が適用されます。
ネイティブiOSプロジェクトにリンクするために、ios
ディレクトリでpod install
を実行します。ios
ディレクトリに切り替えずにこれを行うショートカットは、npx pod-install
を実行することです。
npx pod-install
これが完了したら、アプリバイナリを再ビルドして新しいライブラリの使用を開始します。
- npm
- Yarn
npm run ios
yarn ios
Androidでのネイティブコードのリンク
React NativeはGradleを使用してAndroidプロジェクトの依存関係を管理します。ネイティブ依存関係を持つライブラリをインストールした後、新しいライブラリを使用するためにアプリバイナリを再ビルドする必要があります。
- npm
- Yarn
npm run android
yarn android
ライブラリの検索
React Native Directoryは、React Native用に特別に構築されたライブラリの検索可能なデータベースです。これは、React Nativeアプリのライブラリを探す最初の場所です。
ディレクトリで見つける多くのライブラリは、React Native CommunityまたはExpoのものです。
React Native Communityによって構築されたライブラリは、ボランティアやReact Nativeに依存する企業の個人によって推進されています。これらは通常、iOS、tvOS、Android、Windowsをサポートしていますが、これはプロジェクトによって異なります。この組織の多くのライブラリは、かつてReact NativeのコアコンポーネントとAPIでした。
Expoによって構築されたライブラリはすべてTypeScriptで書かれており、可能な限りiOS、Android、およびreact-native-web
をサポートしています。
React Native Directoryの後に、ディレクトリでReact Native専用のライブラリが見つからない場合は、npmレジストリが次善の策です。npmレジストリはJavaScriptライブラリの決定的な情報源ですが、リストされているすべてのライブラリがReact Nativeと互換性があるとは限りません。React Nativeは、Node.js、Webブラウザ、Electronなど、多くのJavaScriptプログラミング環境の1つであり、npmにはこれらのすべての環境で機能するライブラリが含まれています。
ライブラリの互換性の判断
React Nativeで動作しますか?
通常、他のプラットフォーム専用に構築されたライブラリはReact Nativeでは動作しません。例としては、Web用に構築され、react-dom
を具体的にターゲットとするreact-select
や、Node.js用に構築され、コンピュータのファイルシステムとやり取りするrimraf
などがあります。lodash
のような他のライブラリは、JavaScript言語機能のみを使用し、どの環境でも動作します。時間の経過とともにこの感覚を掴むことができますが、それまでは自分で試してみるのが最も簡単な方法です。React Nativeで動作しないことが判明した場合は、npm uninstall
を使用してパッケージを削除できます。
私のアプリがサポートするプラットフォームで動作しますか?
React Native Directoryでは、iOS、Android、Web、Windowsなどのプラットフォーム互換性でフィルタリングできます。使用したいライブラリが現在そこにリストされていない場合は、詳細についてはライブラリのREADMEを参照してください。
私のアプリのReact Nativeバージョンで動作しますか?
通常、ライブラリの最新バージョンはReact Nativeの最新バージョンと互換性があります。古いバージョンを使用している場合は、インストールすべきライブラリのバージョンを知るためにREADMEを参照する必要があります。特定のバージョンのライブラリは、npm install <library-name>@<version-number>
を実行してインストールできます。例:npm install @react-native-community/netinfo@^2.0.0
。