Using Firsebase + Firestore with Deno - firebase

Question

I'm trying to use firebase, specifically firestore, wtih Deno, but am running into issues with both v8 and v9 of the APIs.
For v8 I follow this tutorial from Deno, but receive the error Property firestore does not exist on firebase.
import "https://deno.land/x/xhr#0.1.2/mod.ts";
import firebase from "https://cdn.skypack.dev/firebase#8.10.0/app";
import "https://cdn.skypack.dev/firebase#8.10.0/firestore";
const firebaseConfig = { ... };
firebase.initializeApp( firebaseConfig, 'app' );
const firebaseApp = firebase.app( 'app' );
const db = firebase.firestore( firebaseApp );
The same error occurs for firebase version 8.7.0.
For v9 I get the error Service firestore is not available
import "https://deno.land/x/xhr#0.1.2/mod.ts";
import { initializeApp } from "https://cdn.skypack.dev/firebase#9.4.1/app";
import { getFirestore } from "https://cdn.skypack.dev/firebase#9.4.1/firestore";
const firebaseConfig = { ... };
const firebaseApp = initializeApp( firebaseConfig );
const db = getFirestore( firebaseApp );
And if I don't pass firebaseApp to the getFirestore call I get the error No Firebase App '[DEFAULT]' has been created.
...
const db = getFirestore();
MRE
v8.js
import "https://deno.land/x/xhr#0.1.2/mod.ts";
import firebase from "https://cdn.skypack.dev/firebase#8.10.0/app";
import "https://cdn.skypack.dev/firebase#8.10.0/firestore";
const firebaseConfig = {
apiKey: "apikey",
authDomain: "pid.firebaseapp.com",
projectId: "pid",
storageBucket: "pid.appspot.com",
messagingSenderId: "msid",
appId: "aid",
measurementId: "mid"
};
firebase.initializeApp( firebaseConfig, 'app' );
const firebaseApp = firebase.app( 'app' );
const db = firebase.firestore( firebaseApp );
Run with deno run v8.js.
output
> deno run v8.js
Property 'firestore' does not exist on type '{ __esModule: boolean; initializeApp: (options: any, rawConfig: any) => any; app: { (name2: any): any; App: any; }; registerVersion: (libraryKeyOrName: any, version2: any, variant: any) => void; ... 4 more ...; INTERNAL: { ...; }; }'.
const db = firebase.firestore( firebaseApp );
> deno run --no-check v8.js
Uncaught TypeError: Cannot read properties of null (reading 'INTERNAL')
e3.INTERNAL.registerComponent(new Component("firestore", function(e4) {
^
at https://cdn.skypack.dev/-/#firebase/firestore#v2.4.0-WKZzTerrZCqDrKBg0YNc/dist=es2019,mode=imports/optimized/#firebase/firestore.js:11912:8
at I (https://cdn.skypack.dev/-/#firebase/firestore#v2.4.0-WKZzTerrZCqDrKBg0YNc/dist=es2019,mode=imports/optimized/#firebase/firestore.js:11916:4)
at https://cdn.skypack.dev/-/#firebase/firestore#v2.4.0-WKZzTerrZCqDrKBg0YNc/dist=es2019,mode=imports/optimized/#firebase/firestore.js:11920:1
v9.js
import "https://deno.land/x/xhr#0.1.2/mod.ts";
import { initializeApp } from "https://cdn.skypack.dev/firebase#9.4.1/app";
import { getFirestore } from "https://cdn.skypack.dev/firebase#9.4.1/firestore";
const firebaseConfig = {
apiKey: "apikey",
authDomain: "pid.firebaseapp.com",
projectId: "pid",
storageBucket: "pid.appspot.com",
messagingSenderId: "msid",
appId: "aid",
measurementId: "mid"
};
const firebaseApp = initializeApp( firebaseConfig );
const db = getFirestore( firebaseApp );
Run with deno run v8.js
output
> deno run v9.js
Uncaught Error: Service firestore is not available
throw Error(`Service ${this.name} is not available`);
^
at Provider.getImmediate (https://cdn.skypack.dev/-/#firebase/component#v0.5.9-NRovvSCAF0YOkKLBn5pi/dist=es2019,mode=imports/optimized/#firebase/component.js:111:15)
at Oa (https://cdn.skypack.dev/-/#firebase/firestore#v3.3.0-7hhS3yMUs2qdY64sdriE/dist=es2019,mode=imports/optimized/#firebase/firestore.js:9969:39)
at file:///home/brian/Downloads/firebase-test/mrc-v9.ts:17:12
> deno run --no-check v9.js
Uncaught Error: Service firestore is not available
throw Error(`Service ${this.name} is not available`);
^
at Provider.getImmediate (https://cdn.skypack.dev/-/#firebase/component#v0.5.9-NRovvSCAF0YOkKLBn5pi/dist=es2019,mode=imports/optimized/#firebase/component.js:111:15)
at Oa (https://cdn.skypack.dev/-/#firebase/firestore#v3.3.0-7hhS3yMUs2qdY64sdriE/dist=es2019,mode=imports/optimized/#firebase/firestore.js:9969:39)
at file:///home/brian/Downloads/firebase-test/mrc-v9.ts:17:12

Answer 1

As mentioned by #bicarlsen, the issue is related to compatibility between the firebase module. And for that he has raised an issue on Github.

Answer 2

A workaround has been posted in the GitHub thread related to this issue. Instead of import from https://cdn.skypack.dev/firebase#9.4.1/app, you can import from https://www.gstatic.com/firebasejs/9.6.0/firebase-app.js, and similarly by replacing app in the URL for the other modules.