【Flutter3.27以降】マルチプロジェクトの作成

  • 2024年12月17日
  • 2024年12月17日
  • Dart
Dart

はじめに

Flutter 3.27.0以降のPub Workspaces機能を利用して、複数のパッケージを含むマルチプロジェクト（モノレポ）を構築する方法について解説します。

せっかくなので、Flutter Advent Calendar 2024のパート2の17日目に参加。

手順

メインディレクトリの作成

まずはプロジェクトのメインディレクトリを作成し、FVMを使用してFlutterバージョンを指定します。

mkdir flutter_multi_project
cd flutter_multi_project
fvm use 3.27.0

パッケージディレクトリの作成

FlutterとDartのパッケージを作成します。

mkdir packages
cd packages
fvm dart create -t package data
fvm dart create -t package domain
fvm flutter create -e ui
  • data: データ層パッケージ
  • domain: ドメイン層パッケージ
  • ui: Flutterアプリケーション

ワークスペース設定

ルートディレクトリにpubspec.yamlを作成し、ワークスペースの設定を追加します。

pubspec.yaml

name: flutter_multi_project
publish_to: 'none'
environment:
  sdk: ^3.6.0

workspace:
  - packages/domain
  - packages/data
  - packages/ui

—

各パッケージのpubspec.yaml修正

ワークスペース内で依存関係を解決するため、各パッケージのpubspec.yamlにresolution: workspaceを追加します。

packages/domain/pubspec.yaml

publish_to: 'none'

environment:
  sdk: ^3.6.0
resolution: workspace

packages/data/pubspec.yaml

publish_to: 'none'

environment:
  sdk: ^3.6.0
resolution: workspace

dependencies:
  domain:
    path: ../domain

packages/ui/pubspec.yaml

environment:
  sdk: ^3.6.0
resolution: workspace

dependencies:
  flutter:
    sdk: flutter
  domain:
    path: ../domain

依存関係の解決

以下のコマンドを実行して、ワークスペース全体の依存関係を解決します。

fvm flutter pub get

動作確認

最終的に、ワークスペース内で以下のコマンドを実行してプロジェクトをビルドします。

cd packages/ui
fvm flutter run

多言語対応の非サポートと対策

Flutter 3.27.0(今後改善されるとは思いますが)のワークスペース環境では、多言語対応でgenerate: trueがサポートされていません。そのため自動生成される.dart_tool/flutter_gen/gen_l10nではなく、別のディレクトリに作成するため、以下の対応が必要です。

エラーメッセージ
generate: true is not supported within workspaces.

このエラーを回避するために、synthetic-packageをfalseに設定し、出力先をlib/l10n-genなどに明示します。

l10n.yamlの作成

packages/ui/l10n.yamlに多言語対応の設定を記述します。内容自体は、よしなに設定してください。output-dir: lib/l10n-genとsynthetic-package: falseで独自の場所に生成するのが重要です。

template-arb-file: app_en.arb
output-localization-file: l10n.dart
output-dir: lib/l10n-gen
output-class: L10n
synthetic-package: false
nullable-getter: false

pubspec.yamlの修正

packages/ui/pubspec.yamlから通常追加するgenerate: trueを削除します。

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter
  intl: ^0.19.0

flutter:
  uses-material-design: true
  ## generate: true

まとめ

  • Pub Workspacesを利用することで、モノレポ構成のFlutterアプリが簡単に構築可能。
  • ワークスペース内での多言語対応には注意が必要（synthetic-package: falseを設定する）。
  • FVMと併用することで、バージョン管理もスムーズに行える。

これで、ワークスペースを使用したFlutterマルチプロジェクトのセットアップが完了しました！

参考