普通视图

发现新文章,点击刷新页面。
昨天以前首页

flutter_flavorizr 多渠道打包、多环境打包利器,不需要再一个个手动配置了

2025年8月10日 11:25

在 app 开发中,测试工程师经常会说,我要在一个手机上同时安装测试环境、预发布环境、正式环境的包,又或者一套代码上架多个 app,怎么搞,手动配置多个环境过程繁琐。无意间看到 flutter_flavorizr 插件 传送门,完美解决了我的问题

1.安装

dev_dependencies:
  flutter_flavorizr: ^2.4.1

2.在项目根目录手动创建 flavorizr.yaml文件,app icon 用 1024*1024

image.png

3.在flavorizr.yaml文件中配置环境信息

flavors:
  develop:
    app:
      name: "meituan"
      icon: "assets/icons/icon_develop.png"

    android:
      applicationId: "com.meituan.develop"  
    ios:
      bundleId: "com.meituan.develop"
  staging:
    app:
      name: "meituan"
      icon: "assets/icons/icon_staging.png"
  
    android:
      applicationId: "com.meituan.staging"
    ios:
      bundleId: "com.meituan.staging"

  prod:
    app:
      name: "meituan"
      icon: "assets/icons/icon_prod.png"
  
    android:
      applicationId: "com.meituan"
    ios:
      bundleId: "com.meituan"

ide: vscode

4.配置完毕后,运行下面脚本

flutter pub run flutter_flavorizr

如遇到下面提示 Do you want to proceed? (Y/n),直接回复 y

The following instructions will be executed:
 - assets:download
 - assets:extract
 - android:androidManifest
 - android:flavorizrGradle
 - android:buildGradle
 - android:dummyAssets
 - android:icons
 - flutter:flavors
 - flutter:app
 - flutter:pages
 - flutter:main
 - ios:podfile
 - ios:xcconfig
 - ios:buildTargets
 - ios:schema
 - ios:dummyAssets
 - ios:icons
 - ios:plist
 - ios:launchScreen
 - google:firebase
 - huawei:agconnect
 - assets:clean
 - ide:config
Do you want to proceed? (Y/n) y

如遇到 Failed to update packages, 需要科学上网

⠏ [assets:download] Executing... (90.2s)Unhandled exception:
HttpException: Connection closed before full header was received, uri = https://github.com/AngeloAvv/flutter_flavorizr/releases/download/v2.4.1/assets.zip
Failed to update packages.

脚本执行完毕

image.png

在 android/app/src中生成了 develop、staging 和 prod等目录,里面是 icon 等配置信息

image.png

同样在 iOS文件中自动生成环境和 icon 等配置信息

image.png

如果使用的是vscode编辑器,还会生成 launch.json配置,如下图,默认没有格式化,可使用 vscode 的格式工具,cmd+s保存完成格式化

image.png

格式化后,launch.json配置如下

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "develop Debug",
            "request": "launch",
            "type": "dart",
            "flutterMode": "debug",
            "args": [
                "--flavor",
                "develop"
            ],
            "program": "lib/main.dart"
        },
        {
            "name": "develop Profile",
            "request": "launch",
            "type": "dart",
            "flutterMode": "profile",
            "args": [
                "--flavor",
                "develop"
            ],
            "program": "lib/main.dart"
        },
        {
            "name": "develop Release",
            "request": "launch",
            "type": "dart",
            "flutterMode": "release",
            "args": [
                "--flavor",
                "develop"
            ],
            "program": "lib/main.dart"
        },
        {
            "name": "staging Debug",
            "request": "launch",
            "type": "dart",
            "flutterMode": "debug",
            "args": [
                "--flavor",
                "staging"
            ],
            "program": "lib/main.dart"
        },
        {
            "name": "staging Profile",
            "request": "launch",
            "type": "dart",
            "flutterMode": "profile",
            "args": [
                "--flavor",
                "staging"
            ],
            "program": "lib/main.dart"
        },
        {
            "name": "staging Release",
            "request": "launch",
            "type": "dart",
            "flutterMode": "release",
            "args": [
                "--flavor",
                "staging"
            ],
            "program": "lib/main.dart"
        },
        {
            "name": "prod Debug",
            "request": "launch",
            "type": "dart",
            "flutterMode": "debug",
            "args": [
                "--flavor",
                "prod"
            ],
            "program": "lib/main.dart"
        },
        {
            "name": "prod Profile",
            "request": "launch",
            "type": "dart",
            "flutterMode": "profile",
            "args": [
                "--flavor",
                "prod"
            ],
            "program": "lib/main.dart"
        },
        {
            "name": "prod Release",
            "request": "launch",
            "type": "dart",
            "flutterMode": "release",
            "args": [
                "--flavor",
                "prod"
            ],
            "program": "lib/main.dart"
        }
    ]
}

vscode 中选择一种模式运行代码

image.png

在运行 iOS 模拟器时,如果遇到 xcode 报下面的错误,

# The Xcode project does not define custom schemes. You cannot use the --flavor option

那是因为没有安装 xcodeproj,执行下面代码安装

sudo gem install xcodeproj

然后再执行

flutter pub run flutter_flavorizr

5.后续服务器、三方等配置信息,可根据 flavor 进行配置

image.png

import 'flavors.dart';

class EnvConfig {
  static String get baseUrl {
    switch (F.appFlavor) {
      case Flavor.develop:
        return 'https://dev.api.example.com';
      case Flavor.staging:
        return 'https://staging.api.example.com';
      case Flavor.prod:
        return 'https://api.example.com';
    }
  }
}

IMG_4643.PNG

❌
❌