Error In Flutter: FirebaseOptions cannot be null when creating the default app.

If you have stumbled upon this error: “FirebaseOptions cannot be null when creating the default app”. From what I can tell I see that there can be a few different issues.

One of them is that you are using a lower version of Flutter which have the requirement of the function of Firebase.initializeApp() to pass the options into the initializeApp function which you’ve simply forgot.

Another issue is that you have placed the google-services.json file in the wrong directory. It should be inside the android app folder, like so android\app. Could also be an issue of not adding dependency google services to build.gradle (both in android/app folder and in android folder) like shown at the tutorial here.

Third one, and it’s specifically for flutter web, that is to say, I got the error and the only solution for the error to disappear and it would work as expected was to replace the index.html file contents with the example from a stackoverflow post here. See similar code below from my index.html file:

<!DOCTYPE html>
<html>

<head>
  <!--
    If you are serving your web app in a path other than the root, change the
    href value below to reflect the base path you are serving from.
    The path provided below has to start and end with a slash "/" in order for
    it to work correctly.
    Fore more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
  -->
  <base href="/">

  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
  <meta name="description" content="A new Flutter project.">

  <!-- iOS meta tags & icons -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="chat">
  <link rel="apple-touch-icon" href="icons/Icon-192.png">

  <!-- Favicon -->
  <link rel="icon" type="image/png" href="favicon.png" />

  <title>chat</title>
  <link rel="manifest" href="manifest.json">
</head>

<body>
  <!-- Insert these scripts at the bottom of the HTML, but before you use any Firebase services -->

  <!-- Firebase App (the core Firebase SDK) is always required and must be listed first -->
  <script src="https://www.gstatic.com/firebasejs/8.4.3/firebase-app.js"></script>

  <!-- If you enabled Analytics in your project, add the Firebase SDK for Analytics -->
  <script src="https://www.gstatic.com/firebasejs/8.4.3/firebase-analytics.js"></script>

  <!-- Add Firebase products that you want to use -->
  <script src="https://www.gstatic.com/firebasejs/8.4.3/firebase-auth.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.4.3/firebase-firestore.js"></script>
  <!-- This script installs service_worker.js to provide PWA functionality to
       application. For more information, see:
       https://developers.google.com/web/fundamentals/primers/service-workers -->
  <script>
    // TODO: Replace the following with your app's Firebase project configuration
    // For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field
    var firebaseConfig = {
      apiKey: "x",
      authDomain: "mything.firebaseapp.com",
      projectId: "mything",
      storageBucket: "mything.appspot.com",
      messagingSenderId: "x",
      appId: "x.",
      measurementId: "x"
    };

    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
  </script>
  <script>
    if ('serviceWorker' in navigator) {
      window.addEventListener('flutter-first-frame', function () {
        navigator.serviceWorker.register('flutter_service_worker.js');
      });
    }
  </script>

  <script src="main.dart.js" type="application/javascript"></script>
</body>

</html>
0 0 votes
Article rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments