Facebook Login - Object Error

Hi everyone! I recently started developing ionic, and I’m still learning, and now I’ve faced an issue:
I’ve followed this tutorial: https://ionicframework.com/docs/native/facebook but it doesn’t seem to work, I tried to find solutions online but none of them worked… can someone help me?

My login.ts

import { Component, OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { IonicPage, NavController, ToastController } from 'ionic-angular';
import { User } from '../../providers';
import { MainPage } from '../';
import { HttpClient } from '@angular/common/http';
import { Facebook, FacebookLoginResponse } from '@ionic-native/facebook/ngx';

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage implements OnInit {
  // The account fields for the login form.
  // If you're using the username field with or without email, make
  // sure to add it to the type
  account: { usuario: string, password: string } = {
    usuario: '',
    password: ''
  };

  constructor(public navCtrl: NavController,
    public user: User,
    public toastCtrl: ToastController,
    public translateService: TranslateService,
    public http: HttpClient,
    private fb: Facebook) {}
  ngOnInit(){}

  // Attempt to login in through our User service
  doLogin() {
    this.user.login(this.account).subscribe((resp) => {
      this.navCtrl.push(MainPage);
    }, (err) => {
      this.navCtrl.push(MainPage);
    });
  }

  doFbLogin(){
    this.fb.login(['public_profile', 'user_friends', 'email'])
    .then((res: FacebookLoginResponse) => console.log('Logged into Facebook!', res))
    .catch(e => console.log('Error logging into Facebook', e));
	}

}

login.html button

<button ion-button class=“button-login-facebook” (click)=“doFbLogin()”>Facebook

and my package.json

{
  "name": "aaaaaaaaaaaaaaaaa",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "start": "ionic-app-scripts serve",
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint"
  },
  "dependencies": {
    "@angular/animations": "5.2.11",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/compiler-cli": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/camera": "4.3.3",
    "@ionic-native/core": "~4.20.0",
    "@ionic-native/facebook": "^5.17.0",
    "@ionic-native/native-storage": "^5.0.0",
    "@ionic-native/splash-screen": "~4.20.0",
    "@ionic-native/status-bar": "~4.20.0",
    "@ionic/storage": "2.2.0",
    "@ngx-translate/core": "8.0.0",
    "@ngx-translate/http-loader": "^2.0.0",
    "cordova": "^9.0.0",
    "cordova-android": "^8.1.0",
    "cordova-plugin-facebook4": "^6.2.0",
    "cordova-plugin-nativestorage": "^2.3.2",
    "es6-promise-plugin": "^4.2.2",
    "ionic-angular": "3.9.5",
    "ionic-plugin-navigation-bar-color": "^1.0.2",
    "ionicons": "^3.0.0",
    "rxjs": "5.5.11",
    "sw-toolbox": "3.6.0",
    "ts-md5": "^1.2.4",
    "zone.js": "0.8.29"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.2.2",
    "@ionic/lab": "2.0.13",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^4.1.1",
    "cordova-plugin-navigationbar-color": "0.0.8",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "typescript": "~2.6.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {
        "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
      },
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-navigationbar-color": {},
      "cordova-plugin-facebook4": {
        "APP_ID": "erased cause I dont know if u guys can see this haha",
        "APP_NAME": "cookcrawler",
        "FACEBOOK_HYBRID_APP_EVENTS": "false",
        "FACEBOOK_ANDROID_SDK_VERSION": "5.5.2"
      },
      "cordova-plugin-nativestorage": {}
    },
    "platforms": [
      "android"
    ]
  }
}

The error i’m getting:

ERROR TypeError: Object(...) is not a function
    at Facebook.login (index.js:62)
    at LoginPage.webpackJsonp.351.LoginPage.doFbLogin (login.ts:41)
    at Object.eval [as handleEvent] (LoginPage.html:73)
    at handleEvent (core.js:13589)
    at callWithDebugContext (core.js:15098)
    at Object.debugHandleEvent [as handleEvent] (core.js:14685)
    at dispatchEvent (core.js:10004)
    at core.js:10629
    at HTMLButtonElement.<anonymous> (platform-browser.js:2628)
    at t.invokeTask (polyfills.js:3)

Facebook configs are ok, dependencies installed with appname and appid ok too.
Is probably a version error, but I dont know, please save meeeee!!!

You have what I call a Frankenproject: it’s a mashup of various incompatible versions of things.

If as you say you’re relatively new to Ionic, I would suggest generating a new project from scratch following the instructions in here. Make sure all of your @ionic-native stuff has the same major version (you currently have a mix of 4 and 5, which is the proximate cause of the error you’re seeing, but you will be better off in the long run with more recent Ionic and Angular versions that you will get from a new project).

I created a project using the “super” command, and I kept going like that :confused:
Guess i’ll create another one and copy the code