如何在Flutter单代码库中区分开发与生产构建，免手动切换调试UI

我平时开发Flutter跨平台项目时也经常遇到这个需求——不想每次打包生产版本都手动注释调试代码，还要兼顾开发时的调试便利性。下面给你几个实用的方案，都是社区和官方推荐的做法：

1. 用官方的kDebugMode区分环境 #

这是最简单直接的方案，Flutter在package:flutter/foundation.dart里提供了kDebugMode常量，它会自动根据构建模式切换值：debug模式下为true，release/profile模式下为false。

示例代码： #

import 'package:flutter/foundation.dart';
import 'package:flutter_redux_dev_tools/flutter_redux_dev_tools.dart';

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Stack(
          children: [
            // 主内容区域
            MainContent(),
            // 仅在Debug模式显示Redux调试工具
            if (kDebugMode)
              Positioned(
                bottom: 20,
                right: 20,
                child: ReduxDevTools(store),
              ),
          ],
        ),
      ),
    );
  }
}

// 自定义调试打印
void debugPrintLog(String message) {
  if (kDebugMode) {
    print('[DEBUG LOG] $message');
  }
}

2. 用编译时环境变量实现多环境区分 #

如果需要更灵活的多环境（比如开发、测试、生产）控制，可以用Flutter的--dart-define参数传递环境变量，编译时动态切换。

步骤： #

• 运行开发版本时：

flutter run --dart-define=APP_ENV=development

• 构建生产版本时：

flutter build apk --dart-define=APP_ENV=production

代码中获取并判断： #

// 定义环境常量
const String appEnv = String.fromEnvironment('APP_ENV', defaultValue: 'production');

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Stack(
          children: [
            MainContent(),
            // 仅在开发环境显示调试UI
            if (appEnv == 'development')
              ReduxDevTools(store),
          ],
        ),
      ),
    );
  }
}

// 自定义环境专属打印
void envPrint(String message) {
  if (appEnv == 'development') {
    print('[DEV LOG] $message');
  } else if (appEnv == 'staging') {
    print('[STAGING LOG] $message');
  }
  // 生产环境自动忽略
}

3. 用Dart断言执行调试代码 #

Dart的assert语句只会在debug模式下执行，release模式下会被完全移除，适合轻量的调试逻辑。

示例： #

class MyHomePage extends StatefulWidget {
  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
    // 仅在Debug模式初始化调试工具
    assert(() {
      // 初始化Redux Dev Tool
      setupReduxDevTools(store);
      print('Debug mode: 调试工具已初始化');
      return true; // 断言需要返回布尔值
    }());
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Flutter App')),
      body: Center(child: Text('主内容')),
    );
  }
}

最佳实践 #

• 把所有调试相关的UI组件、工具方法封装到单独的文件（比如debug_utils.dart、debug_widgets.dart），方便统一管理；
• 不要在生产环境可能用到的逻辑里依赖调试代码，避免因环境判断失误导致线上问题；
• 如果用Redux，也可以结合Redux中间件，只在debug模式添加日志中间件。

内容的提问来源于stack exchange，提问作者Tran Triet