Ionic-native: Ionic 4: Blank screen when using ionic native firebase

Created on 28 Aug 2018  路  3Comments  路  Source: ionic-team/ionic-native

I'm submitting a ...
[x] bug report
[ ] feature request

Current behavior:
Blank screen at startup after app loading

Steps to reproduce:
Starting from a clean Ionic 4 project.
First build work fine then adding @ionic-native/firebase (and cordova-plugin-firebase) show the problem.
No error on building just on the chrome console

index.js:530 Uncaught TypeError: Object(...) is not a function at index.js:530 at Object../node_modules/@ionic-native/firebase/index.js (index.js:747) at __webpack_require__ (bootstrap:81) at Object../src/app/app.module.ts (app.component.ts:11) at __webpack_require__ (bootstrap:81) at Object../src/main.ts (environment.ts:15) at __webpack_require__ (bootstrap:81) at Object.0 (main.ts:12) at __webpack_require__ (bootstrap:81) at checkDeferredModules (bootstrap:43)

and on safari

TypeError: Object(_ionic_native_core__WEBPACK_IMPORTED_MODULE_1__["Cordova"]) is not a function. (In 'Object(_ionic_native_core__WEBPACK_IMPORTED_MODULE_1__["Cordova"])()', 'Object(_ionic_native_core__WEBPACK_IMPORTED_MODULE_1__["Cordova"])' is an instance of Object)

Related code:
I just import the plugin on the app.module

import { Firebase } from '@ionic-native/firebase';

....
providers:[
 ....,
 Firebase,
 .....
]

Ionic info: :

Ionic:

   ionic (Ionic CLI)          : 4.1.1 (/usr/local/lib/node_modules/ionic)
   Ionic Framework            : @ionic/angular 4.0.0-beta.3
   @angular-devkit/core       : 0.7.5
   @angular-devkit/schematics : 0.7.5
   @angular/cli               : 6.1.5
   @ionic/ng-toolkit          : 1.0.7
   @ionic/schematics-angular  : 1.0.5

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : android 7.0.0
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.2, cordova-plugin-ionic-webview 2.1.0, (and 4 other plugins)

System:

   Android SDK Tools : 26.1.1 (/Users/......./Library/Android/sdk)
   ios-deploy        : 2.0.0
   ios-sim           : 7.0.0
   NodeJS            : v8.11.4 (/usr/local/bin/node)
   npm               : 6.4.0
   OS                : macOS High Sierra
   Xcode             : Xcode 9.4.1 Build version 9F2000

Thank You for the help!!

Most helpful comment

Hi, as you are using ionic 4 which is still in beta, have you installed the beta version of the firebase module ?

npm install --save @ionic-native/firebase@beta

I see that your import line is

import { Firebase } from '@ionic-native/firebase';

However, the firebase plugin (and I guess every ionic-native plugin) should now be imported this way

import { Firebase } from '@ionic-native/firebase/ngx';

I hope that can help you !

All 3 comments

Hi, as you are using ionic 4 which is still in beta, have you installed the beta version of the firebase module ?

npm install --save @ionic-native/firebase@beta

I see that your import line is

import { Firebase } from '@ionic-native/firebase';

However, the firebase plugin (and I guess every ionic-native plugin) should now be imported this way

import { Firebase } from '@ionic-native/firebase/ngx';

I hope that can help you !

Hi, as you are using ionic 4 which is still in beta, have you installed the beta version of the firebase module ?

npm install --save @ionic-native/firebase@beta

I see that your import line is

import { Firebase } from '@ionic-native/firebase';

However, the firebase plugin (and I guess every ionic-native plugin) should now be imported this way

import { Firebase } from '@ionic-native/firebase/ngx';

I hope that can help you !

Thanks bro!

Hi, as you are using ionic 4 which is still in beta, have you installed the beta version of the firebase module ?

npm install --save @ionic-native/firebase@beta

I see that your import line is

import { Firebase } from '@ionic-native/firebase';

However, the firebase plugin (and I guess every ionic-native plugin) should now be imported this way

import { Firebase } from '@ionic-native/firebase/ngx';

I hope that can help you !

also applies to other native imports, perhaps print it on a billboard somewhere

Was this page helpful?
0 / 5 - 0 ratings

Related issues

shaliko picture shaliko  路  3Comments

christianwico picture christianwico  路  4Comments

wwallace picture wwallace  路  4Comments

ajcrites picture ajcrites  路  3Comments

goleary picture goleary  路  3Comments