No firebase.app.App instance is currently initialized. Angular 6 sign in with phone error

Question

I've initialized firebase app, and tried every possible thing, but I'm unable to remove this error. I'm trying firebase sign in with phone number authentication.

Below is my app.component.ts file:

import { AngularFireAuth } from 'angularfire2/auth';
import { Component } from '@angular/core';
import * as firebase from 'firebase/app';
import { AngularFireModule } from 'angularfire2';
import { AngularFirestoreModule } from 'angularfire2/firestore';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {

  applicationVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container', {
    'size': 'invisible',
    'callback': function(response) {
    },
    'expired-callback': function() {
    }
    });
   signIn(phone) {

    firebase.auth().signInWithPhoneNumber(phone, this.applicationVerifier)
    .then(function(confirmationResult) {
      var code = window.prompt("Please enter your code");
      return confirmationResult.confirm(code);
    })
    .then(function(result) {
    })
    .catch(function(error) {
      console.log("error", error);
    });
   }
  }

Please help resolve this error.

Answer 1

I was having the same issue. Calling firebase.initializeApp solved it for me.

In the Component's ngOnInit() function add the following line before you create the RecaptchaVerifier.

firebase.initializeApp(config);