1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Flutterアプリ開発の自動化(ビルド@コンテナ、エミュレータ@ホスト) 3. Flutterプロジェクト作成

Posted at

下記の記事の続きです。

前提

環境

  • macOS Sequoia ver. 15.4.1
  • Docker(別環境でPodmanでも確認済み)

スクリーンショット 2025-06-21 1.14.22.png

ここまでの作業

  • 下記のDockerfileを用意
    FROM ubuntu:22.04
    
    ARG FLUTTER_VERSION=stable
    ENV DEBIAN_FRONTEND=noninteractive
    
    ENV ANDROID_SDK_ROOT=/opt/android-sdk
    ENV ANDROID_HOME=/opt/android-sdk
    ENV PATH=/home/flutter/flutter/bin:$ANDROID_SDK_ROOT/cmdline-tools/latest/bin:$ANDROID_SDK_ROOT/platform-tools:$PATH
    
    # --- 必須パッケージのインストール ---
    RUN apt-get update && apt-get install -y \
        curl git unzip xz-utils zip libglu1-mesa openjdk-17-jdk sudo gosu \
        && rm -rf /var/lib/apt/lists/*
    
    # --- Android SDK Command-line Tools インストール ---
    RUN mkdir -p $ANDROID_SDK_ROOT/cmdline-tools && \
        curl -o /tmp/cmdline-tools.zip https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip && \
        unzip /tmp/cmdline-tools.zip -d $ANDROID_SDK_ROOT/cmdline-tools && \
        mv $ANDROID_SDK_ROOT/cmdline-tools/cmdline-tools $ANDROID_SDK_ROOT/cmdline-tools/latest && \
        rm /tmp/cmdline-tools.zip
    
    # --- Android SDK コンポーネントインストール ---
    RUN yes | $ANDROID_SDK_ROOT/cmdline-tools/latest/bin/sdkmanager --sdk_root=$ANDROID_SDK_ROOT \
        "platform-tools" \
        "platforms;android-33" \
        "build-tools;33.0.0" \
        "emulator" \
        "system-images;android-33;google_apis;x86_64"
    
    # --- flutterユーザーの作成と権限付与 ---
    RUN useradd -m flutter && echo "flutter ALL=(ALL) NOPASSWD: ALL" >> /etc/sudoers && \
        chown -R flutter:flutter $ANDROID_SDK_ROOT
    
    # --- Flutter SDK インストール ---
    USER flutter
    WORKDIR /home/flutter
    ARG FLUTTER_VERSION
    RUN git clone -b ${FLUTTER_VERSION} --depth 1 https://github.com/flutter/flutter.git /home/flutter/flutter && \
        cd /home/flutter/flutter && \
        git fetch --depth=2 origin $(git rev-parse HEAD)
    
    ENV PATH=/home/flutter/flutter/bin:$ANDROID_SDK_ROOT/cmdline-tools/latest/bin:$ANDROID_SDK_ROOT/platform-tools:$PATH
    
    # --- Flutter 初期セットアップ ---
    RUN flutter precache
    RUN git config --global --add safe.directory /home/flutter/flutter
    
    # --- entrypoint.sh のコピー ---
    USER root
    COPY entrypoint.sh /entrypoint.sh
    RUN chmod +x /entrypoint.sh
    
    # --- デフォルト作業ディレクトリとエントリポイント設定 ---
    WORKDIR /project
    ENTRYPOINT ["/entrypoint.sh"]
    
  • 下記のコマンドでDockerコンテナをビルド
    docker build -t flutter-dev .
    

3. Flutterプロジェクト作成

Flutterプロジェクト作成コマンドを実行

  • 下記のコマンドを用いてDockerコンテナ内でFlutterプロジェクト作成スクリプトを実行する
    docker run --rm \
      -v "$PWD":/project \
      --env ANDROID_SDK_ROOT=/opt/android-sdk \
      --env ANDROID_HOME=/opt/android-sdk \
      --env PATH=/home/flutter/flutter/bin:/opt/android-sdk/cmdline-tools/latest/bin:/opt/android-sdk/platform-tools:$PATH \
      flutter-dev \
      bash -c "cd /project && flutter create project_name && echo 'sdk.dir=/opt/android-sdk' > /project/$PROJECT_NAME/android/local.properties"
    

各オプション詳細

  • --rm
    • コンテナ実行終了後、自動的に削除
    • 一時的な作業なのでイメージをクリーンに保つことができる
  • -v "$PWD":/project
    • -v:ボリュームマウントの指定
    • "$PWD":ホスト側のカレントディレクトリ(プロジェクトを作成したい場所)
    • /project:コンテナ内の作業ディレクトリにマウントされる場所
    • ホストのカレントディレクトリがコンテナの /project にマウントされることにより、コンテナ内で作成したファイルがホスト側に反映される
  • --env ANDROID_SDK_ROOT=/opt/android-sdk
    --env ANDROID_HOME=/opt/android-sdk
    • FlutterのAndroidターゲットビルドで必要
  • --env PATH=/home/flutter/flutter/bin:/opt/android-sdk/cmdline-tools/latest/bin:/opt/android-sdk/platform-tools:$PATH
    • Flutterコマンドやsdkmanagerなどが使えるようにパスを指定
  • flutter-dev
    • 使用するDockerイメージの指定
  • bash -c "..."
    • 複数コマンドをまとめて1つの文字列として実行
    • cd /project
      • マウントされたホストの作業ディレクトリに移動
    • flutter create project_name
      • Flutterの新規プロジェクトを作成
      • project_nameは作成したいプロジェクトの名前
    • echo 'sdk.dir=/opt/android-sdk' > .../local.properties
      • Android Studio用の設定ファイル local.properties を作成し、SDKのパスを明示
      • 通常これはローカル環境に自動生成されるが、Docker環境では手動で記述が必要

Flutterプロジェクトが作成されることを確認

  • ここまでの作業で下記のプロジェクトが作成される
    project_name/
    ├── analysis_options.yaml
    ├── pubspec.yaml
    ├── pubspec.lock
    ├── project_name.iml
    ├── README.md
    ├── android/
    ├── ios/
    ├── macos/
    ├── windows/
    ├── linux/
    ├── web/
    ├── lib/
    └── test/
    

ディレクトリの役割

  • lib/
    アプリ本体のDartコードを格納するフォルダ。main.dart から実行が始まり、画面やロジックなどの大部分がここに含まれる。

  • android/
    Android 向けのネイティブコードとビルド設定。Gradle構成、AndroidManifest、KotlinやJavaコードなどが含まれる。

  • ios/
    iOS 向けのネイティブコードとXcodeプロジェクト設定。SwiftやObjective-Cコード、Info.plistなどが含まれる。

  • macos/
    macOS アプリとしてビルドするための設定とネイティブコードが含まれる。CMakeベースの構成。

  • windows/
    Windows アプリとしてビルドするための設定とネイティブコードが含まれる。

  • linux/
    Linux アプリとしてビルドするための設定とネイティブコードが含まれる。

  • web/
    Flutter Web アプリとしてのフロントエンドファイル(index.html, favicon.png など)を含む。

  • test/
    Dart で書かれたユニットテストやウィジェットテストを格納するフォルダ。flutter test コマンドで実行できる。

ファイルの役割

  • pubspec.yaml
    Flutterプロジェクトの設定ファイル。アプリ名、バージョン、依存パッケージ、アセット(画像やフォント)などを定義する。

  • pubspec.lock
    pubspec.yaml に基づき解決された依存関係の具体的なバージョンを記録するファイル。プロジェクトの依存性の一貫性を保つ。

  • analysis_options.yaml
    Dartコードに対する静的解析ルール(Lint)を定義する設定ファイル。チームでコーディング規約を統一するために使われる。

  • README.md
    プロジェクトの概要や使い方、インストール手順などをMarkdown形式で記述するファイル。GitHub などで表示される。

  • project_name.iml
    IntelliJ IDEA / Android Studio が使用するプロジェクトメタデータファイル。エディタの内部的な設定に使われる。

次回予定

  • ユニットテスト
1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?