Flutter & Google App Engine build

guideline_flutter_gcloud_appengine.md

Manual deploy

1. Install gcloud CLI on your environment: https://cloud.google.com/sdk/docs/install
2. Create a project on GCP and enable Cloud Build API (this service requires the payment setup on your account): https://console.cloud.google.com/apis/library/cloudbuild.googleapis.com
3. Create an app engine by CLI

gcloud app create

4. Create & build Flutter project Note: Use Web as target platform in this sample

flutter create hello
flutter build web

5. Create app.yaml file in your Flutter project (root directory)

app.yaml

env: standard
runtime: nodejs14

handlers:
  - url: /
    static_files: build/web/index.html
    upload: build/web/index.html
    secure: always
    redirect_http_response_code: 301

  - url: /(.*)
    static_files: build/web/\1
    upload: build/web/(.*)
    secure: always
    redirect_http_response_code: 301

6. Deploy it

gcloud app deploy

Check the output endpoint from the console, it will look like this: https://flutter-deploy-demo.as.r.appspot.com

Auto deploy

1. Check Service account permissions and make sure App Engine Admin is enabled.
2. Prepare source repository

There are two ways:

• Upload your source code from local to 3rd party service (Github for eg) and then connect to Cloud Source Repositories
• Create a code repository in Cloud Source Repositories

Remember to update app.yaml file. This file will be copied to build/web after flutter build command, that's reason why the path is pointing to index.html file and root dir. For eg:

app.yaml

env: standard
runtime: nodejs14

handlers:
  - url: /
    static_files: index.html
    upload: index.html
    secure: always
    redirect_http_response_code: 301

  - url: /(.*)
    static_files: \1
    upload: (.*)
    secure: always
    redirect_http_response_code: 301

3. Build Cloud Build runner for Flutter There is no supported builder for Flutter: see cloud-builders. But cloud-builders-community does.

• Clone cloud-builders-community to your local machine
• cd flutter
• In Dockerfile, remove unnecessary setup for Android:

Dockerfile

FROM debian:stretch

#Update stretch repositories
RUN sed -i s/deb.debian.org/archive.debian.org/g /etc/apt/sources.list
RUN sed -i 's|security.debian.org|archive.debian.org/|g' /etc/apt/sources.list
RUN sed -i '/stretch-updates/d' /etc/apt/sources.list

# Install Dependencies.
RUN apt update -y
RUN apt install -y \
  git \
  wget \
  curl \
  unzip \
  lib32stdc++6 \
  libglu1-mesa \
  default-jdk-headless

# Install Flutter.
ENV FLUTTER_ROOT="/opt/flutter"
RUN git clone https://github.com/flutter/flutter "${FLUTTER_ROOT}"
ENV PATH="${FLUTTER_ROOT}/bin:${PATH}"

# Disable analytics and crash reporting on the builder.
RUN flutter config  --no-analytics

# Perform an artifact precache so that no extra assets need to be downloaded on demand.
RUN flutter precache

# Perform a doctor run.
RUN flutter doctor -v

# Switch to the correct channel
ARG channel=stable
RUN flutter channel $channel

# Perform a flutter upgrade
RUN flutter upgrade

ENTRYPOINT [ "flutter" ]

• Update /flutter/cloudbuild.yaml (only need stable and master channels, save money)

cloudbuild.yaml

# In this directory, run the following command to build this builder.
# $ gcloud builds submit . --config=cloudbuild.yaml

steps:
- name: 'docker:stable'
  args: [
    'build', '.',
    '-t', 'gcr.io/$PROJECT_ID/flutter:master',
    '--build-arg', 'channel=master',
  ]

- name: 'docker:stable'
  args: [
    'build', '.',
    '-t', 'gcr.io/$PROJECT_ID/flutter:stable',
    '-t', 'gcr.io/$PROJECT_ID/flutter',
    '--build-arg', 'channel=stable',
  ]

- name: 'gcr.io/$PROJECT_ID/flutter'
  args: ['--help']

timeout: '1200s'

images: [
  'gcr.io/$PROJECT_ID/flutter:master',
  'gcr.io/$PROJECT_ID/flutter:stable',
  'gcr.io/$PROJECT_ID/flutter',
]
tags: ['cloud-builders-community']

• Start building image on GCP

gcloud builds submit . --config=cloudbuild.yaml

• After the process completed, check results at Container Registry images

4. Configure build Flutter

• Add another cloudbuild.yaml file in the Flutter project root dir:

cloudbuild.yaml

steps:
  - name: 'gcr.io/$PROJECT_ID/flutter:stable'
    args: ['build', 'web']
  - name: gcr.io/google.com/cloudsdktool/cloud-sdk
    args:
      - '-c'
      - cp app.yaml build/web && cd build/web && gcloud config set app/cloud_build_timeout 1600 && gcloud app deploy
    entrypoint: bash
timeout: 1600s

Commit and push that file to Cloud source repository

• Add a trigger at https://console.cloud.google.com/cloud-build/triggers and then run it