Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Trouble bundling Firestore for Universal (ENOENT / app.firestore not a function)

See original GitHub issue

Version info

Angular: 10@latest & 11@latest - same result

Firebase: 8.1.1

AngularFire: 6.1.1

Node: 12

Was all working fine on Firebase with SSR setup following the angularfire Guide. We upgraded Firebase JS SDK and in order to get SSR working again, we had to remove the following from angular.json :

            "externalDependencies": [
              "@firebase/firestore"
            ]

Hence the error TypeError: app.firestore is not a function disappeared and SSR was working again, except on a sub-page that actually tries to load from data from firestore. When rendering this through SSR, we got the error:

Unhandled Promise rejection: ENOENT: no such file or directory, open '/workspace/dist/carchecker-ui/server/src/protos/google/firestore/v1/firestore.proto'

Expected behavior

Get SSR working with Firestore.

Actual behavior

I can choose a halfway working SSR solution by removing externalDependencies in angular.json (server) that seems to render some of the pages or breaking with missing Proto-Buffer stuff. Or break SSR entirely with the TypeError: app.firestore is not a function when having @firebase/firestore in externalDependencies in angular.json.

Issue Analytics

State:
Created 3 years ago
Reactions:4
Comments:9 (4 by maintainers)

Top GitHub Comments

5reactions

solivellaluisalbertocommented, Dec 2, 2020

When i add this to externalDependencies "externalDependencies": [ "@firebase/app", "@firebase/firestore" ] I no longer receive any errors, neither firestore.proto nor app.firestore is not a function I don’t know if this will help you.

5reactions

jamesdanielscommented, Nov 24, 2020

Checkout what I’ve done in my sample app to support this https://github.com/angular/angularfire/blob/master/sample/server.ts#L18. I used dir-loader to include the protos into the server build as a quick hack.

I’m considering what an official happy path here with the schematic might look like.

Top Results From Across the Web

firebase.firestore() is not a function when trying to initialize ...

I create the firebase app elsewhere in my code with initializeApp . This is a server side node.js app. Firebase Admin cannot be...

Usage and limits | Firestore - Firebase

To cap your Cloud Firestore usage, set a daily spending limit through App Engine. App Engine allows you to set a daily spending...

Cloud Firestore - React Native Firebase

Transaction functions should not directly modify application state (return a value from the updateFunction ). Transactions will fail when the client is offline....

Getting data | Firestore - Google Cloud

Call a method to get the data once. · Set a listener to receive data-change events. · Bulk-load Firestore snapshot data from an...