Flutterでマルチパッケージ(マルチモジュール)を実装する

Flutterでマルチモジュール構成を作る際にどのようにするのか？というのを考えて色々調べてましたが、DeNAさんのTechCon Appで既に実現されていました。
GitHub - DeNA/techcon_app: TechCon App

別パッケージを作るので、マルチモジュールというよりもマルチパッケージと言ったほうが良さそうですね。

ということで、上記を参考に実際にマルチパッケージ構成を作ってみました。

github.com

構成説明

今回は以前実装したGoogle Books APIのサンプルをベースに、data層をパッケージ分割しました。
ディレクトリ構成は以下の通りになります。

root
 |
 |
 |-- app
      |
      |- lib
      |- ios
      |- android
      |- pubspec.yaml
      ...
 |
 |-- data
      |
      |- lib
      |- pubspec.yaml
      ...

既存のFlutterアプリはappディレクトリに移動し、Modelクラスと通信部分をdataパッケージとして切り出します。

具体的な手順

今回dataパッケージはFlutterに依存しない、dartパッケージになるため、dartのモジュールの作成手順に従います。コマンドは以下の通り。

# dartパッケージ
dart create --template=package-simple data
# Flutterパッケージ
flutter create --template=package data

上記でパッケージを作った後に該当のソースコードを移植します。 移植したらapp側でdataパッケージを読み込みます。

# app/pubspec.yamlにて

dependencies:
  data:
    path: ../data

以上でパッケージ分けが完了しました。

おわりに

マルチパッケージ構成にすることで依存関係を整頓できるなどメリットもあるので、今後Flutterで大きなアプリを作っていく場合はこの構成を取っていくのも良さそうですね。