Skip to content
Development
Skill

/flutterfire-configure

Use when adding Firebase to a Flutter project, running flutterfire configure, initializing Firebase in main.dart, or configuring multiple flavors.

From plugin
flutter-ai-skills
67036 skills

Claude Code

$ npx -y skills add evanca/flutter-ai-rules --skill flutterfire-configure --agent claude-code

SKILL.md

flutterfire-configure.SKILL.md
name: flutterfire-configure
description: "Use when adding Firebase to a Flutter project, running flutterfire configure, initializing Firebase in main.dart, or configuring multiple flavors."
license: MIT

FlutterFire Configure Skill

This skill defines how to correctly set up and configure Firebase for Flutter applications.

When to Use

Use this skill when:

  • Adding Firebase to a Flutter project for the first time.
  • Running `flutterfire configure` after adding a new Firebase service or platform.
  • Initializing Firebase in `main.dart`.
  • Setting up separate Firebase projects for multiple app flavors.

---

1. Prerequisites

Install the required tools:

npm install -g firebase-tools
firebase login
dart pub global activate flutterfire_cli

**Minimum platform requirements:**

  • Android: API level 19 (KitKat) or higher
  • Apple: iOS 11 or higher

---

2. Setup and Configuration

# From your Flutter project directory:
flutterfire configure

# Add the core Firebase package:
flutter pub add firebase_core
  • Re-run `flutterfire configure` any time you **add support for a new platform** or **start using a new Firebase service**.
  • For Android-specific services (Crashlytics, Performance Monitoring), the FlutterFire CLI automatically adds the required Gradle plugins.
  • Rebuild with `flutter run` after adding new Firebase plugins.

---

3. Firebase Initialization

import 'package:firebase_core/firebase_core.dart';
import 'firebase_options.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  runApp(const MyApp());
}
  • Call `WidgetsFlutterBinding.ensureInitialized()` **before** Firebase initialization.
  • Place Firebase initialization **before** any other Firebase service calls.
  • **Never modify** `firebase_options.dart` manually — it is auto-generated.
  • **Commit** `firebase_options.dart` to version control — it contains non-secret configuration identifiers.
  • For Firebase Emulator Suite: `await Firebase.initializeApp(demoProjectId: "demo-project-id")`.

---

4. Verification and Best Practices

After configuration, verify the setup is working:

1. Run `flutter run` and confirm the app launches without Firebase initialization errors. 2. Check the debug console for `Firebase initialized successfully` or similar confirmation. 3. Verify `firebase_options.dart` was generated with the correct project ID.

  • Enable **Firebase Analytics** for optimal experience with Crashlytics, Remote Config, and other products.
  • Use a **consistent Firebase project** across all platforms for data consistency.
  • For iOS/macOS apps using certain Firebase services, add the **Keychain Sharing** capability in Xcode.
  • Test the Firebase configuration with **both debug and release** builds.
  • Check **version compatibility** between Flutter plugins and the underlying Firebase SDK.

---

5. Multiple App Flavors

Create separate Firebase projects per environment (development, staging, production):

flutterfire config \
  --project=flutter-app-dev \
  --out=lib/firebase_options_dev.dart \
  --ios-bundle-id=com.example.flutterApp.dev \
  --ios-out=ios/flavors/dev/GoogleService-Info.plist \
  --android-package-name=com.example.flutter_app.dev \
  --android-out=android/app/src/dev/google-services.json

**Centralize Firebase initialization by flavor:**

// firebase.dart
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/services.dart';
import 'package:flutter_app/firebase_options_prod.dart' as prod;
import 'package:flutter_app/firebase_options_stg.dart' as stg;
import 'package:flutter_app/firebase_options_dev.dart' as dev;

Future<void> initializeFirebaseApp() async {
  final firebaseOptions = switch (appFlavor) {
    'prod' => prod.DefaultFirebaseOptions.currentPlatform,
    'stg' => stg.DefaultFirebaseOptions.currentPlatform,
    'dev' => dev.DefaultFirebaseOptions.currentPlatform,
    _ => throw UnsupportedError('Invalid flavor: $appFlavor'),
  };
  await Firebase.initializeApp(options: firebaseOptions);
}
// main.dart
void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await initializeFirebaseApp();
  runApp(const MainApp());
}
  • Use `appFlavor` or environment variables to select the configuration at runtime.
  • Import each flavor's config with **namespace aliases** (e.g., `as dev`).
  • Use a helper script to automate multi-flavor configuration.

---

References

  • [Add Firebase to your Flutter app](https://firebase.google.com/docs/flutter/setup)
  • [FlutterFire CLI](https://firebase.flutter.dev/docs/cli)
Read more
@evanca
Ships withflutter-ai-skills

36 Flutter and Dart skills your coding agent loads by itself, sourced only from official documentation. A skill is a folder with a SKILL.md file.

Stars on GitHub

Momentum

stars in total
670
Star history of evanca/flutter-ai-rules on GitHub, a chart by star-history.com

Other skills on flutter-ai-skills.

accessibility

accessibility

Use when working on accessibility, a11y, WCAG, ARIA, screen readers, keyboard nav, focus order, contrast, alt text, captions,…

bloc

bloc

Use when creating a Cubit or Bloc, modeling state with sealed classes or status enums, wiring…

dart-3-updates

dart-3-updates

Use when writing switch statements, refactoring if-else chains, creating data classes, choosing records vs classes, destructuring…

More skills from other plugins.

brainstorming
Auto-invoked

brainstorming

You MUST use this before any creative work - creating features, building components, adding functionality, modifying behavior, or…

@obra@obraInstall Skill
ask-matt

ask-matt

Ask which skill or flow fits your situation. A router over the skills in this repo.

skills11d309k
@mattpocock@mattpocockInstall Skill
accessibility
Auto-invoked

accessibility

Design, implement, and audit accessible UI to WCAG 2.2 Level AA across Web, iOS, and Android — semantic ARIA roles and labels,…

ecc13d293k
@affaan-m@affaan-mInstall Skill
compiler-commit

compiler-commit

Use when you want to verify compiler changes and commit with the correct convention. Runs tests, lint, and format, then commits…

react2d252k
@facebook@facebookInstall Skill

Questions about flutterfire-configure.

Which coding agents can use flutterfire-configure?
flutterfire-configure installs in Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI, using each agent's flag shown on this page. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.