如何通过Riverpod的FutureProvider初始化Firebase？

1. 定义Firebase初始化的FutureProvider #

创建一个FutureProvider来封装Firebase初始化逻辑，确保初始化操作仅执行一次：

final firebaseInitializationProvider = FutureProvider<void>((ref) async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
});

如果需要自定义Firebase配置（比如多环境适配），可以传入初始化选项：

final firebaseInitializationProvider = FutureProvider<void>((ref) async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
});

2. 在根组件中监听初始化状态 #

使用ConsumerWidget监听初始化状态，根据不同状态渲染对应页面：

class MyApp extends ConsumerWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final initState = ref.watch(firebaseInitializationProvider);

    return MaterialApp(
      home: initState.when(
        loading: () => const SplashScreen(), // 初始化中显示启动页
        error: (err, stack) => ErrorScreen(errorMsg: err.toString()), // 初始化失败显示错误页
        data: (_) => const AuthWrapper(), // 初始化完成后进入鉴权页面
      ),
    );
  }
}

3. 简化main函数 #

现在main函数无需再处理初始化，直接启动应用即可：

void main() {
  runApp(const ProviderScope(child: MyApp()));
}

关键说明 #

• 通过FutureProvider的状态监听，确保只有初始化完成后，才会进入依赖Firebase的页面，彻底避免空指针异常。
• 后续依赖Firebase的Provider（比如用户状态StreamProvider）会自动等待初始化完成后再执行，无需额外处理依赖顺序。

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