How not to get crazy with FlutterFire Crashlytics
Tags: flutter, tutorial, beginners, dart
Published: 2020-12-23 16:13:15

Many of you know Firebase and its services: from Analytics to Messaging. 

**Crashlytics** is one of the most important and useful Firebase's services. This is a great crash reporting tool, with detailed stack trace reporting and many other options to filter and check why your app is (failing? crashing? Se è giusto going down lascialo, però se riesci usa qualcosa di più specifico come: failing etc).

Adding Crashlytics on an Android or iOS app is no big deal. On the other hand, using Flutter is a little bit more complex than how it should be. In my opinion, the [official doc](https://firebase.flutter.dev/docs/crashlytics/overview) isn't sufficiently clear on what to do first, especially if you visit that page with no Firebase knowledge.

So I wanted to summarize the steps you'll need to do to add Crashlytics to your Flutter app, so that you'll no longer need to waste hours on inexplicable errors like I did.

BE AWARE: You should do everything with a Mac because there are some elements you'll have to do on XCode.

 
##
### 1. Create a Firebase Project

This is a pretty easy task. Go [here](https://console.firebase.google.com/) and create a project. Name it whatever you want. Done

 
##
### 2. Download the .json and .plist Google Services files

Now create on your Firebase Project an iOS and an Android app with the top-left buttons. You'll need some data from your app:

- **Android**: bundle_id
- **iOS**: ios_bundle

After that you will be prompted to download a .json file for Android and a .plist file for iOS. Download them in a separate folder and go on. You've created two Firebase Apps now. The easiest part is done.

 
##
### 3. Add Firebase and Crashlytics to your pubspec file

That's not hard, add these dependencies on your `pubspec.yaml` dependencies part:

``` dart
firebase_core: "^0.5.3"
firebase_crashlytics: "^0.2.4"
```

Give it a good `pub get` then forget about Flutter for a few minutes.


##
### 4. Add Firebase plugin and dependencies to Android

Open your Android part of the project and follow these steps:

1. **Add the .json Google Services file into your "app" folder**

2. **Add the Google Services buildscript** dependency to your project `build.gradle` file:

   ``` dart
   buildscript {
    dependencies {
     // ... other dependencies
     classpath 'com.google.gms:google-services:4.3.3'
    }
   }
   ```

   

3.  **Add the Google Services plugin** to your app `build.gradle` file:
   `apply plugin: 'com.google.gms.google-services'`

   

4. **Add Multidex and Firebase**

    to your app build.gradle file:

   ``` dart
   defaultConfig {
       applicationId "YOURID"
       minSdkVersion 19
       targetSdkVersion 29
       versionCode flutterVersionCode.toInteger()
       versionName flutterVersionName
       multiDexEnabled true
   }
   ```

   ``` dart
   dependencies {
       implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
       implementation platform('com.google.firebase:firebase-bom:26.1.0')
       implementation 'com.google.firebase:firebase-crashlytics'
       implementation 'com.google.firebase:firebase-analytics'
       implementation 'com.android.support:multidex:2.0.1'
   }
   ```

Then with Android you should be ok. Time for iOS.

 
##
### 5. Add Firebase script and copy the Google-services.plist file to iOS

Open XCode with your iOS part of Flutter project then:

1. **Copy the** `GoogleService-Info.plist` **file** that you've downloaded in step 2 in your iOS project. Open the Runner project with Xcode (`iOS/Runner.xcworkspace`) and copy the `Google-service-Info.plist` file in the Runner folder. When it's asked make sure that the "*Copy items if needed*" checkbox is enabled.
2. **Add a Build Script so the Firebase Crashlytics runs when the app is built**: go to the "Build Phases" tab of the Runner project, click on the top-left plus button and select "New Run Script Phase". Name it "Firebase Crashlytics" and paste it in the script text box:
   `${PODS_ROOT}/FirebaseCrashlytics/run`

 
##
### 6. Update your Flutter app start code

Make your "main" widget a **Stateful** one and on **initState** do this before the super call:

``` dart
Future<void> _setupCrashlytics() async {
  await Firebase.initializeApp();
  await FirebaseCrashlytics.instance.setCrashlyticsCollectionEnabled(true);
  Function originalOnError = FlutterError.onError;
  FlutterError.onError = (FlutterErrorDetails errorDetails) async {
    await FirebaseCrashlytics.instance.recordFlutterError(errorDetails);
    originalOnError(errorDetails);
  };
}
```


Now you should be ready to go! Try to force a crash with `FirebaseCrashlytics.instance.crash()` and see if it appears on your dashboard.