Search code examples
flutterfirebasegoogle-cloud-firestorefirebase-authentication

Flutter No Firebase App '[DEFAULT]' has been created - call Firebase.initializeApp() but I did initialized Firebase

Problem Description

When I want to launch my Flutter Web App I get the following error:

══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
The following FirebaseException was thrown building DrawerHome(dirty):
[core/no-app] No Firebase App '[DEFAULT]' has been created - call Firebase.initializeApp()

The relevant error-causing widget was:
  DrawerHome DrawerHome:file:///Users/user/Desktop/dev/mywebapp/lib/main.dart:31:13

I also get the following Screen when my App launches in Chrome: enter image description here

The Error message does not help me because I am pretty sure I initialized Firebase the correct way like in this "famous" StackOverflow mentioned.

My Code

main.dart:

import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  const FirebaseOptions firebaseOptions = FirebaseOptions(
    projectId: "projectId",
    appId: "appId",
    apiKey: "apiKey",
    messagingSenderId: "messagingSenderId",
  );

  await Firebase.initializeApp(
    name: "name",
    options: firebaseOptions,
  );

  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      color: Colors.blue,
      debugShowCheckedModeBanner: false,
      home: DrawerHome(),
    );
  }
}

class DrawerHome extends StatelessWidget {
  const DrawerHome({super.key});

  @override
  Widget build(BuildContext context) {
    final user = FirebaseAuth.instance.currentUser;
    return const Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Column(
          children: [
            Text("My App"),
            SizedBox(height: 10),
            Text("$user"),
          ],
        ),
      ),
    );
  }
}

index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta content="IE=Edge" http-equiv="X-UA-Compatible">
    <meta name="description" content="Your Flutter Web App Description">
    <meta name="keywords" content="flutter, web, app">
    <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no">-->
    <title>Your Flutter Web App</title>

    <!-- Firebase SDK -->
    <script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-firestore.js"></script>
  </head>
  <body>
    <!-- Dieses Skript lädt die Flutter-Anwendung -->
    <script defer src="main.dart.js" type="application/javascript"></script>
    <script type="module">
      // Import the functions you need from the SDKs you need
      import { initializeApp } from "firebase/app"; //"https://www.gstatic.com/firebasejs/10.7.1/firebase-app.js";
      import { getAnalytics } from "firebase/analytics"; //"https://www.gstatic.com/firebasejs/10.7.1/firebase-analytics.js";
      import { getAuth } from "firebase/auth"; //"https://www.gstatic.com/firebasejs/10.7.1/firebase-auth.js"; //"firebase/auth";
      // TODO: Add SDKs for Firebase products that you want to use
      // https://firebase.google.com/docs/web/setup#available-libraries
    
      // Your web app's Firebase configuration
      // For Firebase JS SDK v7.20.0 and later, measurementId is optional
      const firebaseConfig = {
        apiKey: "apiKey",
        authDomain: "authDomain",
        databaseURL: "databaseURL",
        projectId: "projectId",
        storageBucket: "storageBucket",
        messagingSenderId: "messagingSenderId",
        appId: "appId",
        measurementId: "measurementId"
      };
    
      // Initialize Firebase
      const app = initializeApp(firebaseConfig);
      const analytics = getAnalytics(app);
      const auth = getAuth(app);
    </script>
  </body>
</html>

Part of my pubspec.yaml:

dependencies:
  blur: ^3.1.0
  cloud_firestore: ^4.4.5
  cupertino_icons: ^1.0.2
  email_validator: ^2.1.17
  firebase_auth: ^4.15.2
  firebase_auth_web: ^5.8.11
  firebase_core: ^2.24.2
  fl_chart: ^0.63.0
  fl_heatmap: ^0.3.0
  flutter:
    sdk: flutter
  flutter_heatmap_calendar: ^1.0.5
  flutter_styled_toast: ^2.1.3
  fluttertoast: ^8.2.1
  geocoding: ^2.1.1
  google_fonts: ^6.1.0
  google_maps_flutter: ^2.2.5
  google_maps_flutter_web: ^0.5.4+2
  http: ^1.1.0
  intl: ^0.18.1
  mask_text_input_formatter: ^2.5.0
  pie_chart: ^5.3.2
  pointer_interceptor: ^0.9.3+4
  provider: ^6.0.5
  url_launcher: ^6.1.10

dev_dependencies:
  flutter_lints: ^2.0.0
  flutter_test:
    sdk: flutter

If I remove the line which calls FirebaseAuth.instance.currentUser the App works perfectly fine. So I assume the Firebase.initializeApp() function in my void main() is not actually the problem. I also tried it out with adding code for FirebaseFirestore. The same Error message occurs again.

My Question

Does anyone else have made experience with this error with a Flutter Web App and FirebaseAuth or FirebaseFirestore?

Thanks in Advance!

Solution

  • After almost 2 weeks of trying to figure out what the problem is, I found a solution that is working for me.

    I simply commented out the name parameter in the initializeApp() function. I don't know why it works but for now that's fine. It may be other solution for your specific project.

    Here is my new void main() function:

    void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  const FirebaseOptions firebaseOptions = FirebaseOptions(
    projectId: "projectId",
    appId: "appId",
    apiKey: "apiKey",
    messagingSenderId: "messagingSenderId",
  );

  await Firebase.initializeApp(
    //name: "name", //<-- THIS IS DID THE TRICK FOR ME
    options: firebaseOptions,
  );

  runApp(const MyApp());
}