DEV Community

Gülsen Keskin
Gülsen Keskin

Posted on

Using Firebase Crashlytics with Flutter

This tutorial explains how to set up Firebase Crashlytics in your app with the Crashlytics Flutter plugin so you can get comprehensive crash reports in the Firebase console.

Create a Firebase project

Create a firebase project by going to Firebase Crashlytics, first going to the visit console, and then clicking the Add project button from the window that opens.

Image description

Make sure that the Google Analytics field is selected

Image description

Image description

Image description

install Firebase CLI with npm

(this step is necessary to be able to execute the flutterfire command.)

npm install -g firebase-tools

Log in to Firebase using your Google account:

Log in to Firebase using your Google account by running the command below:

firebase login

Image description

By listing your Firebase projects, test whether the CLI is installed properly and your account is accessed. Run the following command:

firebase projects:list

Install FlutterFire CLI
Install FlutterFire CLI by running the following command from any directory:

dart pub global activate flutterfire_cli

Add the path that appears in the warning to the path field in your environment variables

example:

Image description

Add Crashlytics to your Flutter project

To install the Crashlytics Flutter plugin, run the following commands on the path where your flutter project is located after running your terminal as an administrator:

flutter pub add firebase_crashlytics

flutterfire configure

Running this command ensures that the Firebase configuration of your Flutter application is up to date and adds the required Crashlytics Gradle plugin for Android to your application.

After running the flutterfire configure command, press enter by selecting the firebase project you created as follows.

Image description

Finally, press enter by selecting the platform (android and iOS will be selected, you can proceed by pressing enter.)

Image description

At the end of this process, two different app IDs for android and iOS are formed.

Image description

android\build.gradle the following lines to your gradle file as pictured

 // START: FlutterFire Configuration
        classpath 'com.google.gms:google-services:4.3.10'
        // END: FlutterFire Configuration
        classpath 'com.google.firebase:firebase-crashlytics-gradle:2.7.1'
Enter fullscreen mode Exit fullscreen mode

Image description

android\app\build.add the following lines to your gradle file as pictured

Image description

// START: FlutterFire Configuration
apply plugin: 'com.google.gms.google-services'
// END: FlutterFire Configuration
apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"

dependencies {
   ...
}
}

apply plugin: 'com.google.firebase.crashlytics'
Enter fullscreen mode Exit fullscreen mode

Once completed, run your Flutter project:

flutter run

Your Firebase project should look like the one pictured

Image description

(Optional) If your Flutter project uses the --split-debug-info flag (and, optionally, the --obfuscate flag), you need to use the Firebase CLI (v.11.9.0+) to upload Android symbols.

From the root directory of your Flutter project, run the following command:

firebase crashlytics:symbols:upload --app=APP_ID PATH/TO/symbols

The PATH/TO/symbols directory is the same directory that you pass to the --split-debug-info flag when building the application.

Note: Support for --split-debug-info is currently only available on Android.
For Apple platforms, support for this feature will be available in an upcoming release, but you can access it now by using the master channel of the Flutter SDK.

Configure crash handlers

You can automatically catch all errors that are thrown within the Flutter framework by overriding FlutterError.onError with FirebaseCrashlytics.instance.recordFlutterFatalError:

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

  await Firebase.initializeApp();

  // Pass all uncaught errors from the framework to Crashlytics.
  FlutterError.onError = FirebaseCrashlytics.instance.recordFlutterFatalError;

  runApp(MyApp());
}
Enter fullscreen mode Exit fullscreen mode

Return an error to test the installation:

TextButton(
    onPressed: () => throw Exception(),
    child: const Text("Throw Test Exception"),
),
Enter fullscreen mode Exit fullscreen mode

Run your application.

Click on the Throw Test Exception button you added to send the first report of your application:

To see your test crash, go to the Firebase console's Crashlytics dashboard.

Image description

If you've refreshed the console and you're still not seeing the test crash after five minutes, enable debug logging to see if your app is sending crash reports.

Resources
Firebase CLI kurun
Firebase'i uygulamanıza ekleyin
crashlytics
flutterfire-is-not-recognized
https://firebase.google.com/docs/crashlytics

Top comments (0)