Firebaseui使用社交媒体登录时没有响应

我试图在我的应用程序中集成firebaseUi . 当用户使用任何社交媒体登录时，系统在auth状态更改后没有给我答案或数据 . 只有我看到下面的查询进度条 .

async ngOnInit() {
  // reset login status
  this.authenticationService.logout();
  // get return url from route parameters or default to '/home'
  this.returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/home';
  await firebase.auth().signOut();

  firebase.auth().onAuthStateChanged(data => {
  console.log(data);
  this.signUpWithSocialIcon(data);
});

}

控制台没有给我写任何东西 . 但是当我使用时

firebase.auth().signInWithEmailAndPassword

我得到了回复并成功登录 .

我的package.json是

{
      "name": "demo-simple",
      "version": "0.0.0",
      "license": "MIT",
      "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
      },
      "private": true,
      "dependencies": {
        "@angular/animations": "~5.1.0",
        "@angular/cdk": "^5.0.2",
        "@angular/common": "~5.1.0",
        "@angular/compiler": "~5.1.0",
        "@angular/core": "~5.1.0",
        "@angular/forms": "~5.1.0",
        "@angular/http": "~5.1.0",
        "@angular/material": "^5.0.2",
        "@angular/platform-browser": "~5.1.0",
        "@angular/platform-browser-dynamic": "~5.1.0",
        "@angular/router": "~5.1.0",
        "@microsoft/microsoft-graph-client": "https://github.com/microsoftgraph/msgraph-sdk-javascript.git",
        "@microsoft/microsoft-graph-types": "https://github.com/microsoftgraph/msgraph-typescript-typings.git",
        "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.7",
        "@types/hellojs": "1.15.0",
        "angular2-emoji-picker": "^1.4.6",
        "angular2-infinite-scroll": "^0.3.5",
        "angular2-isotope": "0.0.2",
        "angular2-lightbox": "^1.2.1",
        "angular2-masonry": "^0.4.0",
        "angular2-moment": "^1.6.0",
        "angularfire2": "^4.0.0-rc0",
        "core-js": "^2.5.3",
        "firebase": "^3.9.*",
        "firebaseui": "^2.5.1",
        "firebaseui-angular": "^2.5.2",
        "font-awesome": "^4.7.0",
        "hammerjs": "^2.0.8",
        "hellojs": "1.16.1",
        "intro.js": "^2.8.0-alpha.1",
        "ng2-imageupload": "^1.4.2",
        "ng2-img-cropper": "^0.9.0",
        "ng2-img-max": "^2.1.9",
        "ng2-translate": "^5.0.0",
        "ngx-owl-carousel": "^2.0.2",
        "rxjs": "^5.5.5",
        "script-loader": "^0.7.2",
        "zone.js": "0.8.18"
      },
      "devDependencies": {
        "@angular/cli": "1.3.0",
        "@angular/compiler-cli": "~5.1.0",
        "@angular/language-service": "~5.1.0",
        "@types/jasmine": "~2.5.53",
        "@types/jasminewd2": "~2.0.2",
        "@types/node": "~6.0.60",
        "codelyzer": "~3.1.1",
        "jasmine-core": "~2.6.2",
        "jasmine-spec-reporter": "~4.1.0",
        "karma": "~1.7.0",
        "karma-chrome-launcher": "~2.1.1",
        "karma-cli": "~1.0.1",
        "karma-coverage-istanbul-reporter": "^1.2.1",
        "karma-jasmine": "~1.1.0",
        "karma-jasmine-html-reporter": "^0.2.2",
        "protractor": "~5.1.2",
        "ts-node": "~3.2.0",
        "tslint": "~5.3.2",
        "typescript": "~2.4.2"
      }
    }