Problem witth App Module adding Facebook provider

Ionic Framework ionic-v3
1

I am making an app and using Angular/ionic and I am trying to place the Facebook provider, but I am getting this error:

Error: Invalid provider for the NgModule 'AppModule' - only instances of Provider and Type are allowed, got: [..., ..., ..., ?[object Object]?

My app.module:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';

import {AngularFireModule} from '@angular/fire';
import {AngularFireStorage, AngularFireStorageModule} from '@angular/fire/storage';
import {AngularFireAuthModule} from '@angular/fire/auth';
import {AngularFirestoreModule} from '@angular/fire/firestore';
import {Facebook} from '@ionic-native/facebook';
import {LoginPageModule} from './pages/login/login.module';



@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [
    BrowserModule,
    IonicModule.forRoot(),
    AppRoutingModule,
    AngularFireModule.initializeApp(firebaseConfig),
    AngularFireAuthModule,
    AngularFireStorageModule,
    AngularFirestoreModule,



  ],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
   Facebook <------------------------- ERROR
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

Can anyone help me?

Is the Facebook provider outdated? I am following a toturial and doing all steps right, but after I place the provider I get this error

2

You posted this in the Ionic v3 subcategory. If this is intentional, and you are creating a new project, that’s a bad combination, because framework v3 is obsolete. Use the latest version instead (5 as I write this).

Now a word about Ionic versioning. There are lots of disparate parts of “Ionic”, and they all have versioning that moves independently. To recap, if you’re starting a new app, you want Ionic Framework 5.3.1+. If you are stuck with an existing Ionic Framework v3 codebase, then your post is in the right place, but you’re going to have some (potentially tough) decisions to make.

Ionic Native is one of those bits that has independent versioning, and it’s conveniently also on major version 5 at the moment. YOU CANNOT MIX AND MATCH DIFFERENT MAJOR VERSIONS OF IONIC NATIVE BITS. Look in your package.json. All the @ionic-native/* things must have the same major version. If you are making a new app, and using current framework versions, this is a no-brainer: you want the latest @ionic-native things as well: 5.28.0 at the moment. If you have a legacy codebase, then Ionic Native 5 might not be compatible with the rest of your code: you’re going to have to evaluate that.

In order to support frameworks other than Angular, the import syntax for Ionic Native things changed in major version 5. The proper way to do it is documented here: note the trailing /ngx. If you have to go back to Ionic Native 4.x for compatibility reasons, the import syntax you are now using is proper.

I don’t recommend doing that, though, unless the app is in maintenance/EOL already, because you are going to have to upgrade it at some point otherwise, and the more frequently you do that, the easier each time becomes, so when in doubt, use current versions of things.