Flutter Flavor series (part 1): Flutter Flavors Setup

These are series on how to set up environments in Flutter. There are just a few guides on the internet but they are complicated, I want to make a minimal and detailed guide for developers.

In this article, I will guide how to set up a minimum Flavor for Flutter.

The entry point for each flavor is now divided to main_development.dart, main_staging.dart, main_production.dart, so let remove the main.dart and add 3 files above:

The entry file has missions to pass environment variables to the main App Widget (MyApp). But since we do not have Env.dart and MyApp.dart yet, let’s add them.

Extras 1: Commands to run and to build Flutter project with Flavors

Run command:

flutter run --flavor [flavor_name] -t /lib/main_[flavor_name].dart

Build command:

flutter build [bundle_file_type] --flavor [flavor_name] -t /lib/main_[flavor_name].dart

where flavor_name is one of development, staging, production and bundle_file_type is one of ipa (iOS), apk (Android), abb (Android)

Extras 2: Config Android Studio to run Flutter Flavor

Step 1: select edit configuration in toolbar

Step 2: Update Name, Dart entry point and Build flavor input values relative to each Flavor. And make sure to enable Share checkbox

Extras 3: Config VSCode to run Flutter Flavor

Step 1: add .vscode/launch.json

Step 2: add configs for each Flavor

Now, you have finishes setup Flavors for Flutter. Remember that env.dart file contain secret information, so be careful to keep it safe (by encryption, …)

You just finished the configs for .dart. If you run the build or run command, there will be errors since there have been not Flavor Native configs yet.

You are ready for the next path, let’s config Flavors for
- Android: https://medium.com/@datvt9312/flutter-series-part-2-android-flavors-setup-b3e3ba5c3d5b
- iOS: https://medium.com/@datvt9312/flutter-series-part-3-ios-flavors-setup-47cbf9274883

If you want more, there are referenced links here:
https://flutter.dev/docs/deployment/flavors