No Firebase App '[DEFAULT]' has been created - call Firebase.initializeApp() in Flutter and Firebase

I am building a Flutter application and I have integrated Firebase, but I keep getting this error when I click on a button either to register, login, or logout. I have seen other people have asked the same question, but none seems to work for me. I am using Flutter and [Android Studio][1]. How can I fix this problem?

**This is an excerpt of my code**

class HomeScreen extends StatefulWidget {
@override
_HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.red,
body: Center(
child: Container(
child: RaisedButton(
onPressed: () {
FirebaseAuth.instance.signOut().then((value) {
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (context) =>
LoginScreen()));
});
},
child: Text("Logout"),
)
)
)
);
}
}

**Below is the thrown exception**

```lang-none
══╡ EXCEPTION CAUGHT BY GESTURE ╞═══════════════════════════════════════════════════════════════════
The following FirebaseException was thrown while handling a gesture:
[core/no-app] No Firebase App '[DEFAULT]' has been created - call Firebase.initializeApp()

When the exception was thrown, this was the stack:

#0 MethodChannelFirebase.app (package:firebase_core_platform_interface/src/method_channel/method_channel_firebase.dart:118:5)
#1 Firebase.app (package:firebase_core/src/firebase.dart:52:41)
#2 FirebaseAuth.instance (package:firebase_auth/src/firebase_auth.dart:37:47)
#3 _HomeScreenState.build.<anonymous closure> (package:cosytok/screens/home.dart:20:28)
#4 _InkResponseState._handleTap (package:flutter/src/material/ink_well.dart:992:19)
#5 _InkResponseState.build.<anonymous closure> (package:flutter/src/material/ink_well.dart:1098:38)
#6 GestureRecognizer.invokeCallback (package:flutter/src/gestures/recognizer.dart:184:24)
#7 TapGestureRecognizer.handleTapUp (package:flutter/src/gestures/tap.dart:524:11)
#8 BaseTapGestureRecognizer._checkUp (package:flutter/src/gestures/tap.dart:284:5)
#9 BaseTapGestureRecognizer.handlePrimaryPointer (package:flutter/src/gestures/tap.dart:219:7)
#10 PrimaryPointerGestureRecognizer.handleEvent (package:flutter/src/gestures/recognizer.dart:477:9)
#11 PointerRouter._dispatch (package:flutter/src/gestures/pointer_router.dart:78:12)
#12 PointerRouter._dispatchEventToRoutes.<anonymous closure> (package:flutter/src/gestures/pointer_router.dart:124:9)
#13 _LinkedHashMapMixin.forEach (dart:collection-patch/compact_hash.dart:377:8)
#14 PointerRouter._dispatchEventToRoutes (package:flutter/src/gestures/pointer_router.dart:122:18)
#15 PointerRouter.route (package:flutter/src/gestures/pointer_router.dart:108:7)
#16 GestureBinding.handleEvent (package:flutter/src/gestures/binding.dart:220:19)
#17 GestureBinding.dispatchEvent (package:flutter/src/gestures/binding.dart:200:22)
#18 GestureBinding._handlePointerEvent (package:flutter/src/gestures/binding.dart:158:7)
#19 GestureBinding._flushPointerEventQueue (package:flutter/src/gestures/binding.dart:104:7)
#20 GestureBinding._handlePointerDataPacket (package:flutter/src/gestures/binding.dart:88:7)
#24 _invoke1 (dart:ui/hooks.dart:267:10)
#25 _dispatchPointerDataPacket (dart:ui/hooks.dart:176:5)
(elided 3 frames from dart:async)

Handler: "onTap"
Recognizer:
TapGestureRecognizer#f0104
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by gesture ═══════════════════════════════════════════════════════════════
The following FirebaseException was thrown while handling a gesture:
[core/no-app] No Firebase App '[DEFAULT]' has been created - call Firebase.initializeApp()
```

[1]:

[To see links please register here]

## Starting Since August 17 2020

All Firebase versions have been updated and now you have to call `Firebase.initializeApp()` before using any Firebase product, for example:

First, all Firebase products now depend on `firebase_core` version (0.5.0+), therefore you need to add it in the `pubspec.yaml` file:


```yaml
dependencies:
flutter:
sdk: flutter
firebase_core : ^0.5.0
# cloud_firestore: ^0.14.0 other firebase dependencies
```

Then you have to call `Firebase.initializeApp()`:

### First Example

```
import 'package:flutter/material.dart';

// Import the firebase_core plugin
import 'package:firebase_core/firebase_core.dart';

void main() {
runApp(App());
}

class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FutureBuilder(
// Initialize FlutterFire
future: Firebase.initializeApp(),
builder: (context, snapshot) {
// Check for errors
if (snapshot.hasError) {
return SomethingWentWrong();
}

// Once complete, show your application
if (snapshot.connectionState == ConnectionState.done) {
return MyAwesomeApp();
}

// Otherwise, show something whilst waiting for initialization to complete
return Loading();
},
);
}
}
```

### Second Example with Firestore:

```
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: FirstRoute(title: 'First Route'),
);
}
}

class FirstRoute extends StatefulWidget {
FirstRoute({Key key, this.title}) : super(key: key);
final String title;

@override
_FirstRouteState createState() => _FirstRouteState();
}

class _FirstRouteState extends State<FirstRoute> {
@override
void initState() {
super.initState();
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("test"),
),
body: FutureBuilder(
future: getData(),
builder: (context, AsyncSnapshot<DocumentSnapshot> snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Column(
children: [
Container(
height: 27,
child: Text(
"Name: ${snapshot.data.data()['name']}",
overflow: TextOverflow.fade,
style: TextStyle(fontSize: 20),
),
),
],
);
} else if (snapshot.connectionState == ConnectionState.none) {
return Text("No data");
}
return CircularProgressIndicator();
},
));
}

Future<DocumentSnapshot> getData() async {
await Firebase.initializeApp();
return await FirebaseFirestore.instance
.collection("users")
.doc("docID")
.get();
}
}
```

### Third Example:

Initialize it in `initState()` then call `setState()` which will call the `build()` method.

```
@override
void initState() {
super.initState();
Firebase.initializeApp().whenComplete(() {
print("completed");
setState(() {});
});
}
```

### Fourth Example:

Initialize it in the `main()` method after calling `WidgetsFlutterBinding.ensureInitialized();`

```
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(MyApp());
}
```

### **Note**: You only have to call `initializeApp()` once

You need to add `await Firebase.initializeApp();` which is a `Future`. Do it inside the dart file that is running your Firebase function like below:

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

Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(MaterialApp());
}

1) Add to pubspec.yaml


firebase_core :

2) add to main.dart

import 'package:firebase_core/firebase_core.dart';

void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(MyApp());
}

If you still have the problem when you leave the app to the main screen, you could add this to whatever `.dart` file using Firebase:

```
class App extends StatelessWidget {

final Future<FirebaseApp> _initialization = Firebase.initializeApp();

@override
Widget build(BuildContext context) {
```
Or in the case of a `StatefulWidget`:

```
import 'package:flutter/material.dart';

// Import the firebase_core plugin
import 'package:firebase_core/firebase_core.dart';

void main() {
runApp(App());
}

class App extends StatefulWidget {
_AppState createState() => _AppState();
}

class _AppState extends State<App> {
// Set default `_initialized` and `_error` state to false
bool _initialized = false;
bool _error = false;

// Define an async function to initialize FlutterFire
void initializeFlutterFire() async {
try {
// Wait for Firebase to initialize and set `_initialized` state to true
await Firebase.initializeApp();
setState(() {
_initialized = true;
});
} catch(e) {
// Set `_error` state to true if Firebase initialization fails
setState(() {
_error = true;
});
}
}

@override
void initState() {
initializeFlutterFire();
super.initState();
}

@override
Widget build(BuildContext context) {
// Show error message if initialization failed
if(_error) {
return SomethingWentWrong();
}

// Show a loader until FlutterFire is initialized
if (!_initialized) {
return Loading();
}

return MyAwesomeApp();
}
}
```

For more information, check [this link][1].

[1]:

[To see links please register here]

First, add this dependency:

firebase_core :

Second: in the project main function, add these two lines and make the function async:

void main() async {
// These two lines
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();

//
runApp(MyApp());
}

Now you can use Firebase normally in any file or widget in the project.

The *FutureBuilder* widget will work either, but you must add it every time you want to access Firebase.

If you followed [Peter's answer][1] and are still getting the same error, check to make sure anything else you have in your `main` function comes after the `await Firebase.initializeApp()` call, like so:

```lang-dart
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
FirebaseCrashlytics.instance.setCrashlyticsCollectionEnabled(true);
FlutterError.onError = FirebaseCrashlytics.instance.recordFlutterError;
runApp(MyApp());
}
```

[1]:

[To see links please register here]

In my case it was because for the Web version you have to manually add stuff in the *index.html* file, not only the .js dependency, but the configuration. See *[Web Installation][1]*.

We tend to forget that for most stuff Flutter is compiled to the target without the need to change anything target-specific, but in this case one must add the configuration for each target.

[1]:

[To see links please register here]

**Flutter Web with Firebase**

If you are using Flutter Web with Firebase make sure you have the SDKs installed in the `body` tag of your `./web/index.html`

<script src="https://www.gstatic.com/firebasejs/8.2.9/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.2.9/firebase-analytics.js"></script>

Furthermore, make sure you call `firebase.initializeApp(...)` with the configuration parameters in the `index.html` as well.

<script>
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
var firebaseConfig = {
apiKey: "AIz...",
authDomain: "...",
databaseURL: "https://<project-name>.firebaseio.com",
projectId: "...",
storageBucket: "<project-name>.appspot.com",
messagingSenderId: "...",
appId: "...",
measurementId: "..."
};
firebase.initializeApp(firebaseConfig);
firebase.analytics();
</script>

At last configure firebase as described in [Peter Haddad's answer][1]:

void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(MyApp());
}

[1]:

[To see links please register here]

You can initialize in the **main.dart** file as well like this using **FutureBuilder**.



future: Firebase.initializeApp(),
Look at this example.

void main() {
runApp(App());
}

class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FutureBuilder(
// Initialize FlutterFire
future: Firebase.initializeApp(),
builder: (context, snapshot) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'NEWSAPI.org',
home: SplashScreen(),

routes: <String, WidgetBuilder>{
SPLASH_SCREEN: (BuildContext context) => SplashScreen(),
},);
},
);
}
}