Set Up New @nativescript/ Firebase

Draft

The new and improved Firebase for NativeScript has a couple of tricks that aren’t obvious. (At least to a non-professional coder like me.)

Here’s the bottom line. In either app.js or store.js (if you use one),

import { firebase } from '@nativescript/firebase-core';

import '@nativescript/firebase-firestore';

firebase().initializeApp()

.then(FirebaseApp =>{

console.log("FirebaseApp configured");

firebase().firestore().collection('userProgress').doc(global.userNum).set({

completed: 1

}, { merge: true })

.then(() => {

console.log("state.completed successfully written!");

})

.catch((error) => {

console.error("Error logging state.completed: ", error);

});

The first thing is that firebase.initializeApp() will not complete until after all the other code in app.js. (Or anything it imports, like store.js.)

CONSOLE LOG: Begin app.js

CONSOLE LOG: imports done

CONSOLE LOG: app launchCONSOLE INFO: ***** Complete Async Created in Home. ++++++++

CONSOLE LOG: slateComponent mounted event fired

CONSOLE LOG: FirebaseApp configured

CONSOLE LOG: Loaded Home page

CONSOLE LOG: state.completed successfully written!

So, if you try to skip the .then{}, or try to access Firestore outside this .then, you’ll just get

Uncaught Error: Failed to get FirebaseApp instance. Please call FirebaseApp.configure() before using Firestore

(Right now, the @Nativescript/firestore-xxx docs tell you to use await. But top-level await is not yet implemented in nativescript/iOS.)

Second, you have to have Firestore properly configured outside this code.

This means you have a GoogleService-Info.plist located in app/App_Resources/iOS and/or a google-services.json located in your app/App_Resources/Android. You’ll download these from the Firebase configuration pages.

And, it means you’ve installed all the Firebase packages you need:

npm install @nativescript/firebase-core
npm install @nativescript/firebase-database
npm install @nativescript/firebase-auth
etc

(It’s easy to forget this if you’re following the docs.)

A third quirk of the new Firebase is that the user object is actually user.user. It’s not clear why this is.