MENU
現役エンジニアが教えない、挫折と苦悩のアプリ開発
  1. ホーム
  2. Flutter
  3. pubspec.yaml の3つのエリアの違い

pubspec.yaml の3つのエリアの違い

Flutter Flutter解説


pubspec.yaml はアプリの設定ファイルです。3つのエリアは、それぞれ役割が違います!

実は下記のそれぞれのエリアの使い方、区別がずっとわからず使っていました。

  • dependencies:
  • dev_dependencies:
  • flutter:

dependencies: – アプリ本体で使うもの

「アプリを動かすために必要なパッケージ」を書く場所です。

dependencies:
  flutter:
    sdk: flutter
  
  provider: ^6.0.0          # 状態管理
  http: ^1.1.0              # API通信
  shared_preferences: ^2.0.0 # データ保存
  google_sign_in: ^6.0.0    # Googleログイン

特徴:

ユーザーがアプリを使うときに必要
アプリに含まれて配布される
リリース版のアプリにも入る

例: 月謝袋アプリなら

データベース関連 (sqflite)
カレンダー連携 (googleapis)
UI部品 (flutter_slidable)

dev_dependencies: – 開発中だけ使うもの

「開発やテストのときだけ必要なパッケージ」を書く場所です。

dev_dependencies:
  flutter_test:
    sdk: flutter
  
  flutter_lints: ^2.0.0     # コードのチェック(警告を出してくれる)
  build_runner: ^2.0.0      # コード自動生成
  mockito: ^5.0.0           # テスト用のダミーデータ作成

特徴:

開発中の自分だけが使う
ユーザーのアプリには含まれない
リリース版には入らない(ファイルサイズが小さくなる!)
dependencies に開発ツールを入れたら動くけど、アプリのファイルサイズが無駄に大きくなります。

例:

コードを綺麗にするツール
自動テストツール
アイコン生成ツール

flutter: – Flutter特有の設定

「Flutter アプリとしての設定」を書く場所です。パッケージではなく設定です。

flutter:
  uses-material-design: true  # Material Design を使う
  
  # 画像ファイルの登録
  assets:
    - assets/images/logo.png
    - assets/images/
    - assets/icons/
  
  # カスタムフォントの登録
  fonts:
    - family: CustomFont
      fonts:
        - asset: assets/fonts/CustomFont-Regular.ttf
        - asset: assets/fonts/CustomFont-Bold.ttf
          weight: 700

特徴:

パッケージではなくリソース(画像・フォント)の設定
アプリで使う画像やフォントを登録する場所
Material Design を使うかどうかの設定
（flutter: に何も書かなくても動くけどuses-material-design: true は普通書く）

エリア何を書く?いつ使う?アプリに含まれる?
dependencies:本番で使うパッケージアプリ動作に必要
dev_dependencies:開発ツール開発・テスト時のみ
flutter:画像・フォント・設定リソース管理


月謝袋アプリの場合:

dependencies:
  flutter:
    sdk: flutter
  
  # アプリで使う(ユーザーも使う)
  sqflite: ^2.0.0              # データベース
  intl: ^0.18.0                # 日付フォーマット
  googleapis: ^11.0.0          # Google Calendar
  google_sign_in: ^6.0.0       # ログイン

dev_dependencies:
  flutter_test:
    sdk: flutter
  
  # 開発中だけ使う(ユーザーには関係ない)
  flutter_lints: ^2.0.0        # コードチェック
  flutter_launcher_icons: ^0.13.0  # アイコン生成

flutter:
  uses-material-design: true
  
  # アプリで使う画像
  assets:
    - assets/images/logo.png
    - assets/icons/

まとめ

  • dependencies: → 本番で必要 (provider, http など)
  • dev_dependencies: → 開発で必要 (テスト、コード整形)
  • flutter: → 画像・フォント・設定
Flutter Flutter解説