「Cannot read property 'setupPurchases' of null」エラーとの格闘記：ExpoでRevenueCatを使うための道のり

---
## 「null」との戦い：ExpoでRevenueCatを動かす秘訣

こんにちは、mk-mokumokuこと渡邊琢資です。プログラミングに興味を持って4年、ゲーム制作からWeb開発、そしてアプリ開発へと情熱を注いでいます。今回は、私がReact NativeアプリにRevenueCatを導入する際に直面した、少々手強いエラーとその解決までの道のりをお話ししたいと思います。

---

### 第1章：RevenueCat導入の期待と、突如現れたエラー

ある日、React NativeとExpoで開発を進めていた私のアプリに、アプリ内課金を導入することになりました。そこで白羽の矢が立ったのが、人気の収益化プラットフォームである**RevenueCat**です。その手軽さに期待を膨らませ、早速 `react-native-purchases` ライブラリをインストールし、コードに組み込んでいきました。

そして、RevenueCatを初期化するために不可欠な `Purchases.configure()` メソッドを呼び出す行に差し掛かった時です。アプリを起動した瞬間、見慣れないエラーメッセージが画面に現れました。


このエラーを見た時、正直なところ「え、何これ？」と頭の中が真っ白になりました。`setupPurchases`？ `null`？ まったく意味が分かりません。ただ、何かが「見つからない」と言っていることだけは理解できました。

---

### 第2章：バージョンアップの落とし穴

まず私が疑ったのは、ライブラリのバージョン競合でした。React Nativeの開発では、`react`と`react-native`のバージョン合わせが非常に重要であることは経験上知っていました。

早速、現在の最新バージョンを確認。本日2025年5月30日時点で、`react`の最新は`19.1.0`ですが、`react-native`の最新は`19.0.0`でした。この二つのパッケージは常に**同じバージョン**でなければならないという厳しい制約があるため、実質的に`19.0.0`が私の環境における「最新」ということになります。

念のため、両方のパッケージを`19.0.0`に揃えて再インストールしました。これで問題なく動くだろう、と期待して再度アプリを起動。しかし、結果は変わりません。同じエラーメッセージが私を嘲笑うかのように表示されました。

「なぜだ…バージョンは完璧に合わせたはずなのに…」

---

### 第3章：Expo Goの意外な制約とネイティブの壁

エラー解決の糸口を求めてインターネットの海をさまよっていると、あるキーワードにぶつかりました。それは「**Expo Goではネイティブモジュールは動かない**」という情報です。

正直、これには驚きました。これまでExpo Goでアプリ開発を進めてきて、特に問題を感じたことはありませんでした。スムーズに開発できるのがExpoの魅力だと思っていたからです。しかし、RevenueCatのような「ネイティブなんちゃら」で組まれたライブラリは、どうやらそうではないらしいのです。

### なぜExpo Goではネイティブモジュールが動かないのか？

ここで少し、Expo Goの仕組みについて整理させてください。

**Expo Go**は、開発者が書いたJavaScriptコードを実行するための、いわば「汎用的なシェルアプリ」です。このアプリには、あらかじめReact Nativeの基本的な機能と、Expo SDKに含まれるAPIが組み込まれています。これにより、私たちは複雑なネイティブ設定に頭を悩ませることなく、手軽にアプリ開発を始められます。

しかし、その手軽さの裏には一つの制約があります。それが「**カスタムネイティブモジュールを追加できない**」という点です。

`react-native-purchases`（RevenueCat SDK）は、まさにこの「カスタムネイティブモジュール」に該当します。このライブラリは、iOSのStoreKitやAndroidのGoogle Play Billing Libraryといった、デバイス固有のアプリ内課金システムと直接通信するために、Objective-C/Swift（iOS）やJava/Kotlin（Android）といった**ネイティブコード**で書かれています。

Expo Goは、これらのネイティブコードをあらかじめ持っていないため、`react-native-purchases`をインポートして`Purchases.configure()`のようなネイティブコードを呼び出そうとすると、「`Purchases`オブジェクトが見つからない（`null`である）」というエラーが発生してしまうのです。

---

### 第4章：救世主「開発ビルド」の導入

この問題の解決策は、ずばり **開発ビルド（Development Build / Dev Client）** の作成でした。

開発ビルドとは、あなたのプロジェクトに必要なすべてのネイティブモジュール（`react-native-purchases`も含む）を組み込んで特別にビルドされた、カスタムのExpoアプリのことです。これを使うことで、Expo Goでは動作しないネイティブモジュールも、開発環境で問題なく動かすことができるようになります。

具体的な手順は以下の通りです。

1.  **`eas-cli`のインストール**:
    まずは、Expoのビルドツールである`eas-cli`をグローバルにインストールします。
    ```bash
    npm install -g eas-cli
    ```
2.  **プロジェクトのセットアップ**:
    初回のみプロジェクトのセットアップが必要です。
    ```bash
    eas project:init
    ```
3.  **開発ビルドの作成**:
    プラットフォーム（iOSまたはAndroid）を指定して、開発ビルドを作成します。
    ```bash
    eas build --profile development --platform ios # iOSの場合
    # または
    eas build --profile development --platform android # Androidの場合
    ```
    このビルドプロセスは少し時間がかかりますが、完了するとデバイスにインストールするためのURLまたはQRコードが提供されます。
4.  **開発アプリのインストールと実行**:
    ビルドされた開発アプリをスマートフォンにインストールし、プロジェクトのルートディレクトリで以下のコマンドを実行します。
    ```bash
    expo start --dev-client
    ```
    そして、Expo CLIが提供するQRコードを開発アプリでスキャンして、アプリを起動します。

---

### 第5章：エラー解消、そしてスムーズな開発への道

上記の開発ビルドの作成と実行手順を終え、再びアプリを起動しました。するとどうでしょう！ あの忌々しい「`Cannot read property 'setupPurchases' of null`」のエラーは表示されず、無事にアプリが起動し、RevenueCatの初期化も成功していることを確認できました。

この経験から、Expo Goの便利さを享受しつつも、ネイティブモジュールを必要とするライブラリを導入する際には、**開発ビルドの作成が必須**であることを痛感しました。特に、アプリ内課金やプッシュ通知、複雑な地図表示など、OSの深い部分にアクセスする機能を持つライブラリは、このカテゴリに属することが多いです。

---

### まとめ：Expoとネイティブモジュールの賢い共存

今回のエラーは私にとって、Expoの強力さと、それに伴う考慮事項を再認識する良い機会となりました。

* **Expo Go**: 素早いプロトタイピングや、ネイティブモジュールを必要としないシンプルなアプリ開発には最適。
* **開発ビルド (Development Build / Dev Client)**: アプリ内課金 (RevenueCat) やプッシュ通知など、ネイティブコードに依存する機能を組み込む際に必須。Expo Goではエラーになる場合でも、これで解決できる可能性が高い。

もしあなたが私と同じように、React NativeとExpoで開発中に`Cannot read property 'setupPurchases' of null`のようなネイティブモジュール関連のエラーに遭遇したら、まずは**開発ビルドの作成**を試してみてください。きっと、解決の道が開けるはずです。

PCの組み立てが好きで、Web開発からアプリ開発まで情熱を注いできた私にとって、今回の経験はまた一つ、技術の深さを知る貴重なステップとなりました。これからも、使いやすいUIの創造を目指し、様々な技術に挑戦していきたいと思います。

#### この記事があなたのエンジニアキャリアの一助になれば幸いです。
#### もしこの記事が役に立ったと感じたら、ぜひ「♡」で教えてください！