2017-07-17 12 views
1

ネイティブプラグインに問題があるようです。ionic3 cordova-plugin-facebook4 facebookインストールでエラーが発生する

LOGPATH:/Users/philipwilson/workspace/ionic/test2/platforms/ios/cordova/console.log

 [21:12:05] console.log: Angular is running in the development mode. Call enableProdMode() to enable the production 
        mode. 
     [21:12:05] console.log: Ionic Native: deviceready event fired after 542 ms 
     [21:12:05] console.warn: Native: tried calling Facebook.browserInit, but the Facebook plugin is not installed. 
     [21:12:05] console.warn: Install the Facebook plugin: 'ionic plugin add cordova-plugin-facebook4' 

は、私は多くのことを試してみました。

518 ionic cordova plugin add cordova-plugin-facebook4 --variable APP_ID="99999999999" --variable APP_NAME="test2.com" 
565 ionic cordova build ios 
578 npm install --save @ionic-native/facebook 
593 ionic plugin add cordova-plugin-facebook4 
594 ionic cordova emulate ios -lc 

私はいくつかの例を踏襲したが、まだイオン3の問題を見て、ここでangular4

は私の情報です:

グローバルパッケージ 〜/ワークスペース/イオン/ test2は$イオン性情報:

@ionic/cli-utils : 1.5.0 
Cordova CLI  : 7.0.1 
Ionic CLI  : 3.5.0 

ローカルパッケージ:

@ionic/app-scripts    : 1.3.7 
@ionic/cli-plugin-cordova  : 1.4.1 
@ionic/cli-plugin-ionic-angular : 1.3.2 
Cordova Platforms    : ios 4.4.0 
Ionic Framework     : ionic-angular 3.4.2 

システム:私はあまりにもこれらの例を見てきました

Node  : v8.0.0 
OS   : OS X El Capitan 
Xcode  : Xcode 8.2.1 Build version 8C1002 
ios-deploy : 1.8.3 
ios-sim : 3.1.1 
npm  : 5.0.0 

install plugin

Run with ios lc

error when testing with run ioshttps://ionicframework.com/docs/native/facebook/ https://ionicthemes.com/tutorials/about/ionic2-facebook-login

誰でも任意の助けがありますか?これは私がやったことある

おかげ フィル

+0

私が正しくインストールされるプラグインを取得するために私のターゲットプラットフォームを削除し、再度追加しなければならなかった問題に遭遇しました。 –

+0

ありがとう..私はそれを試してみてください – philipfwilson

+0

運がいいです..私はcordovaプラグインrm cordova-plugin-facebook4を試しました - その後、cordovaプラグインをインストールしてください[email protected] --save --variable APP_ID = " - 変数APP_NAME =" " – philipfwilson

答えて

4

、あなたはapp.module.tsファイルにFacebookのモジュールを公開することを確認してください。

app.module.ts

import { NgModule, ErrorHandler } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 
import { MyApp } from './app.component'; 

import { AboutPage } from '../pages/about/about'; 
import { ContactPage } from '../pages/contact/contact'; 
import { HomePage } from '../pages/home/home'; 
import { TabsPage } from '../pages/tabs/tabs'; 

import { StatusBar } from '@ionic-native/status-bar'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 

import { Facebook, FacebookLoginResponse } from '@ionic-native/facebook'; 

@NgModule({ 
    declarations: [ 
    MyApp, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage 
    ], 
    imports: [ 
    BrowserModule, 
    IonicModule.forRoot(MyApp) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage 
    ], 
    providers: [ 
    StatusBar, 
    SplashScreen, 
    Facebook, 
    {provide: ErrorHandler, useClass: IonicErrorHandler} 
    ] 
}) 
export class AppModule {} 

そして、あなたのhome.ts中:

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { Facebook, FacebookLoginResponse } from '@ionic-native/facebook'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 

    constructor(public navCtrl: NavController, private fb: Facebook) { 
    this.fb = fb 

    console.log(fb) 

    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)); 


    this.fb.logEvent(this.fb.EVENTS.EVENT_NAME_ADDED_TO_CART); 
    } 

} 

あなたはapp.module.tsファイルにFacebookプロバイダを含め忘れた場合あなたがエラーを取得します:サイドノートとして"No provider for Facebook!"

、作りますSimulatorまたはDeviceを使用してログインアクションをテストする必要があります。そうしないと、動作しません。

資源: - https://javebratt.com/ionic-2-facebook-login/ - https://ionicframework.com/docs/native/facebook/

+0

こんにちは、ありがとう。私はこの問題を過去3日間働いた。私はTypescriptが新しく、いくつかのエラーを出す。再度、感謝します !! Phil – philipfwilson

+0

これは素晴らしいことを知っている。しかし、これは非常に不規則なもののように思える。 '@ ionic-native/facebook'はサードパーティ製のパッケージであるので、' FormBuilder'や 'Http'などのサービスを提供してはいけません。それら。私はAngular 2に由来するちょっとした混乱が、言語そのものの共通のイディオムと重なる不必要な独自のパターンを導入していると思います。 –

0

私は同じ問題を抱えていました。 しかし私はIonicのDevAppアプリケーションで自分のモバイルアプリをテストしていました。 そして、私は、すべてのネイティブコンポーネントがIonicのDevAppでサポートされているとは限りません。続き

は、イオン性のDevAppによってサポートされるプラグインのリストを示しています List of supported plugins

私はそれが働いていたIOSデバイス上でストレートプラグインの私のFacebookを試験したすべての後。 xcodeエミュレータでさえ。

よろしく、 オリバー

関連する問題