Skip to content

Flavors

Jump to bottom
Jimmy edited this page Mar 11, 2024 · 4 revisions

Setting up Flavors with Multiple Firebase Configurations

Flavors allow you to create different versions of your Flutter app with separate configurations, including different Firebase setups. This guide will how to change enviroment firebase to your firebase project. This repo is available for staging and development.if your project has another requirement, you can create a new environment and read in document

Prerequisites

  • Flutter SDK installed on your machine
  • A Firebase project for each flavor you want to set up

Step 1: Get firebase_options using Firebase FlutterFire CLI

NOTE: Each firebase project corresponds to an environment, please repeat this step

  1. Install Firebase FlutterFire CLI
  2. Use the FlutterFire CLI to generate the correct Dart initialization file for each Flutter flavor, with this command:
flutterfire config \
  --project={YOUR_FIREBASE_ID_PROJECT} \
  --out={part to save firebase_options.dart} \
  --ios-bundle-id={BUNDLE_ID_APP} \
  --android-app-id={APP_ID}

Example in repo:

flutterfire config \
  --project=template-app-prod-3a034 \
  --out=lib/firebase_options/firebase_options_prod.dart \
  --ios-bundle-id=com.pingak9.template \
  --android-app-id=com.pingak9.template
  1. With google-services.json and GoogleService-Info.plist created from flutterfire, we will move it to follow step 2 and 3 corresponds to the environment

Step 2: Add google-services.json for Android

  1. Get google-services.json in your Firebase (If you have file from step 1, you can skip this step)
  • Open the Project setting on your Firebase project
  • Scroll to Your apps section
  • Press android app and press download google-services.json
  1. For each google-services.json with the environment, add the path
android/app/src
 |- production/google-services.json
 |- staging/google-services.json

Step 3: Add GoogleService-Info.plist for IOS

  1. Get google-services.json in your Firebase (If you have file from step 1, you can skip this step)
  • Open the Project setting on your Firebase project
  • Scroll to Your apps section
  • Press apples app and press download GoogleService-Info.plist
  1. For each GoogleService-Info.plist with the environment, add the path
ios/config
 |- production/GoogleService-Info.plist
 |- staging/GoogleService-Info.plist

Step 4: Change your app name dependence flavors

Android

  1. Open the file with the path
android/app/src/build.gradle
  1. Look for this code and change name app follow your project
    flavorDimensions "flavor"
    productFlavors { 
        production {
            dimension "flavor"
            applicationIdSuffix ""
            manifestPlaceholders = [appName: "Template"] // Change "Template" to your name app product
        }
        staging {
            dimension "flavor"
            applicationIdSuffix ".stg"
            manifestPlaceholders = [appName: "Template [STG]"] // Change "Template [STG]" to your name app staging
        }
    }

IOS

  1. Open XCode from your project
  2. Select your target then “Build Settings” and search APP_DISPLAY_NAME
  3. Change to the name you want
Clone this wiki locally