🗂

【Flutter】Monorepo環境でFirebase導入エラーに立ち向かう

2025/01/17に公開

はじめに

Pub workspaces を使ってプロジェクトをMonorepoの構成にして、フォルダを整理すると見た目がすっきりしてとても良い気分になります(もっと色々メリットはあるけど、今回はその話はしません😅)が、初期フォルダ構成を元に作られている3rdパーティー製ツールでは色々なビルドトラブルに遭遇します。

今回は👇の様な構成のMonorepoプロジェクトにFirebaseを導入するお話です。

fvm: 3.2.1

Flutter 3.27.1 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 17025dd882 (3 weeks ago) • 2024-12-17 03:23:09 +0900
Engine • revision cb4b5fff73
Tools • Dart 3.6.0 • DevTools 2.40.2
my_flutter_project/
├── apps/                       # 各プラットフォームごとのアプリフォルダ
│   ├── android/               # Androidプラットフォーム関連の設定・ビルドファイル
│   ├── ios/                   # iOSプラットフォーム関連の設定・ビルドファイル
│   ├── web/                   # Webプラットフォーム関連の設定・ビルドファイル
│   ├── lib/                   # アプリケーションのメインコード
│   └── pubspec.yaml           # アプリケーション固有の依存関係
├── packages/                  # 共通モジュールやライブラリ
│   ├── my_common_package/     # 共通コードを含むFlutter/Dartパッケージ
│   │   ├── lib/               # パッケージコード
│   │   └── pubspec.yaml       # パッケージの依存関係
│   └── another_package/       # 別の共通モジュール
│       ├── lib/               # パッケージコード
│       └── pubspec.yaml       # パッケージの依存関係
├── pubspec.yaml               # ルートプロジェクトの依存関係(各パッケージを参照)
├── analysis_options.yaml      # Linterの設定
└── README.md                  # プロジェクト概要

同じGoogleのサービスなんだから簡単に導入できるやろと思ってた

https://firebase.google.com/docs/flutter/setup?hl=ja

この内容に沿ってコマンドを実行していけば基本的にはうまくいくはずですが、

はずなんです。。。
でも、

$ flutterfire configure コマンドでエラーになりました。

やっぱりデフォルトと違うフォルダ構成のプロジェクトだと公式ドキュメントそのままでは導入できない様です。
ここからは僕がMonorepoプロジェクトにFirebaseを導入するまでに遭遇したエラーの対処方法を書き残しておきます。

いろんなエラーに遭遇しました

実行コマンドが合ってないエラー

ということで、先ほども書きましたが、 $ fluttrefire configure コマンド叩いたらエラーになります。

flutterfire configure --project=my_flutter_project-XXXXX
/Users/hiroya/.pub-cache/bin/flutterfire: line 8: dart: command not found
fvm flutterfire configure --project=my_flutter_project-XXXXX
Could not find an option named "project".

Usage: fvm <command> [arguments]

Global options:
-h, --help       Print this usage information.
    --verbose    Print verbose output.
-v, --version    Print the current version.

Available commands:
  api        JSON API for FVM data
  config     Set global configuration settings for FVM
  dart       Proxies Dart Commands
  destroy    Destroy FVM cache by deleting FVM directory
  doctor     Shows information about environment, and project configuration.
  exec       Executes scripts with the configured Flutter SDK
  flavor     Executes a Flutter command using a specified version defined by the project flavor
  flutter    Proxies Flutter Commands
  global     Sets Flutter SDK Version as a global
  install    Installs Flutter SDK Version
  list       Lists installed Flutter SDK Versions
  releases   View all Flutter SDK releases available for install. 
  remove     Removes Flutter SDK Version
  spawn      Spawns a command on a Flutter version
  use        Sets Flutter SDK Version you would like to use in a project

Run "fvm help <command>" for more information about a command.

どうやら実行するパスがあっていない様なので、pubspec.yamlとmain.dartの入っているlibフォルダが見えるフォルダに移動する必要があるのと、今回の環境ではfvmでFlutterのSDKを管理しているので、実行コマンドも fvm exec 経由で叩く必要があります。

Android, iOSのApplication ID, Bundle IDが設定できてないエラー

フォルダを移動して、fvm execで実行したんですが、今度は別のエラーになりました。

$ cd apps && fvm exec flutterfire configure --project=my_flutter_project-XXXXX
fvm: Running version: "3.27.1"

i Found XX Firebase projects. Selecting project my_flutter_project-XXXXX.                                                             
✔ Which platforms should your configuration support (use arrow keys & space to select)? · android, ios, web                
✔ Which Android application id (or package name) do you want to use for this configuration, e.g. 'com.example.app'? ·      
i Firebase android app  is not registered on Firebase project my_flutter_project-XXXXX.                                              
⠙ Registering new Firebase android app on Firebase project my_flutter_project-XXXXX.                                                 
FirebaseCommandException: An error occured on the Firebase CLI when attempting to run a command.
COMMAND: firebase apps:create android app (android) --package-name= --json --project=my_flutter_project-XXXXX 
ERROR: Package name for Android app cannot be empty

今回はandroid, ios環境向けにビルドしたいので、 --android-package-name--ios-bundle-id パラメータを追加する必要があるようです。なので、素直にAndroidのPackage NameとiOSのBundle Identifierをパラメータに追加。

gemに xcodeproj がインストールされてないエラー

これで文句ないだろと思ったら別のところでエラーが発生しました。。。

$ cd apps && fvm exec flutterfire configure --project=my_flutter_project-XXXXX --platforms=android,ios --android-package-name=com.exam.sandbox --ios-bundle-id=com.exam.sandbox
fvm: Running version: "3.27.1"

i Found XX Firebase projects. Selecting project my_flutter_project-XXXXX.                                                                                                                                              
i Selected platforms: android,ios
i Firebase android app com.exam.sandbox registered.                                                                                                                                                          
i Firebase ios app com.exam.sandbox registered.                                                                                                                                                              
Exception: /System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require': cannot load such file -- xcodeproj (LoadError)
	from /System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/rubygems/core_ext/kernel_require.rb:54:in `require'
	from -e:1:in `<main>'

gem に xcodeproj をインストールが必要みたいです(公式に必要だって書いて無かった様な...)🤔
ということでインストールコマンド実行。

まとめ

これで、なんとかFirebaseと連携することができる様になりました🎉
僕は、そろそろこの手のビルドエラー慣れてきましたが、Monorepo構成はツール導入時にエラーになることが多々あるので、そういったエラーに立ち向かう覚悟が必要です😅
チームビルディングで実施する際にはこういった細かなビルドトラブルの共有があるととても助かりますね。

今回の記事が皆さんの力になれたら幸いです。

Discussion