Angular Ivy 9.0 stable and angularfire RC1 using Firestore have trouble with Universal #2320

hiepxanh · 2020-02-07T09:37:40Z

Version info

Angular:
"@angular/animations": "~9.0.0", "@angular/cdk": "^9.0.0", "@angular/common": "~9.0.0", "@angular/compiler": "~9.0.0", "@angular/core": "~9.0.0",
Firebase:

"_from": "firebase@>= 5.5.7 <8",
  "_id": "firebase@7.8.1",

AngularFire:

"@angular/fire": "^6.0.0-rc.1",

How to reproduce these conditions

stackbliz
github

project link will be delete after resolve this issue

Steps to set up and reproduce

after adding Angularfire, it's work normally. But when I start with Universal build, it have problem, clone project and start:
npm run dev:ssr

Debug output

E:\coronavirus-tracking\dist\coronavirus-tracking\ser
ver\main.js:197014
        throw new Error("package.json does not exist at " + package_json_path);
        ^

Error: package.json does not exist at E:\coronavirus-tracking\dist\coronavirus-tracking\package.json
    at Object../node_modules/grpc/node_modules/node-pre-gyp/lib/pre-binding.js.exports.find (E:\coronavirus-tracking\dist\coronavirus-tracking\server\main.js:197014:15)

** Screenshots **

after comment firebase library:

look like the error disappear but sure. angularfire cannot run without firebase/firestore

Expected behavior

not have error when building with universal

Actual behavior

build not succesful

already read about:
#2284
angular issue #34544
#2280

i'm starting desperated after 5 hours

Updated

universal #1207 suggest adding this but it not work:

// angular.json >  architect.server.options
"externalDependencies": [
  "grpc",
  "@grpc/proto-loader"
]

Updated 1

#2284 suggest adding "@angular/fire/firestore" seem work but got other error:

// angular.json >  architect.server.options
"externalDependencies": [
  "grpc",
  "@grpc/proto-loader",
   @angular/fire/firestore"
]

Cannot read property 'id' of undefined

Reference to this update 2

update 3:

add "bundleDependencies": true to angular.json then run npm run build:ssr && npm run serve:ssr having this issues. guest that relate to this #2280

ERROR Error: inject() must be called from an injection context

solution: https://github.com/hiepxanh/angularfire2/blob/a45e0ad4f1c918e78a1610d2b73dee3cc9b1f6b1/docs/universal/getting-started.md

The text was updated successfully, but these errors were encountered:

mazlano27 · 2020-02-07T18:49:35Z

@hiepxanh Found a solution?

jamesdaniels · 2020-02-07T19:10:17Z

Thanks for digging in here, I’ll spend some time debugging too. I’ll want to address for 6.0 stable.

hiepxanh · 2020-02-08T01:54:20Z

@mazlano27 not yet sir. Still digging and stop at there. maybe the problem is UMD and ESM2015 but I don't have experience about this

hiepxanh · 2020-02-08T02:00:50Z

@jamesdaniels you're welcome, I'll do anything you need if you want me to help

mazlano27 · 2020-02-08T02:04:53Z

@mazlano27 not yet sir. Still digging and stop at there. maybe the problem is UMD and ESM2015 but I don't have experience about this

Thank you. Are you able to SSR Angular 9 with @angular/fire@5.4.2? I am getting the same/similar errors you have documented above and am unable to find a working solution

hiepxanh · 2020-02-08T02:07:48Z

@mazlano27 no sir, I belive this problem is will be resolve soon, just maybe some conflict on the module loader conflict.

hiepxanh · 2020-02-08T03:45:25Z

"externalDependencies": [
  "grpc",
  "@grpc/proto-loader",
   @angular/fire/firestore"
]

keep digging deeper, look like I found the loop:
if we not includes externalDependencies['@angular/fire/firestore'] => it cannot load and have trouble with grpc like Error: package.json does not exist
if we have it in the list => it may not complied by Ivy => ɵmod not exist => causing this problem. Cannot read property 'id' of undefined

tiagorvs · 2020-02-08T12:13:02Z

@hiepxanh I was successful disabling Ivy.

tsconfig.json

"angularCompilerOptions": {
    "enableIvy": false
  }

server.ts

import { AppServerModuleNgFactory } from './src/app/app.server.module.ngfactory';
server.engine('html', ngExpressEngine({
    bootstrap: AppServerModuleNgFactory,
}));

angular.json > architect.server.options

"externalDependencies": [
   "grpc",
   "@grpc/proto-loader",
   "@angular/fire/firestore",
   "firebase/firestore"
]

hiepxanh · 2020-02-08T12:58:08Z

I understand sir @tiagorvs, but I would like to work with ivy to get the best performance since angular 9 enable ivy by default

vroussel35 · 2020-02-09T04:01:15Z

Is there any workaround available today? (I've tried the externalDependencies with grpc but it was not successful as previously mentioned by @hiepxanh )

vroussel35 · 2020-02-11T01:48:27Z

Hi @tiagorvs,

I tried your exact same solution (deactivating Ivy - not forgetting to change the server.ts & externalDependencies) and this was not working for us.

On our Google Run instance logs, we have the following stacktrace :

A 2020-02-11T01:26:18.885153Z Error: ENOENT: no such file or directory, open '/usr/src/app/dist/server/src/protos/google/firestore/v1/firestore.proto'
    at Object.openSync (fs.js:443:3)
    at Object.readFileSync (fs.js:343:35)
    at fetch (/usr/src/app/node_modules/protobufjs/src/root.js:160:34)
    at Root.load (/usr/src/app/node_modules/protobufjs/src/root.js:194:13)
    at Root.loadSync (/usr/src/app/node_modules/protobufjs/src/root.js:235:17)
    at Object.loadSync (/usr/src/app/node_modules/@grpc/proto-loader/build/src/index.js:221:27)
    at loadProtos (/usr/src/app/dist/server/main.js:1:3473991)
    at NodePlatform.loadConnection (/usr/src/app/dist/server/main.js:1:3474148)
    at FirestoreClient.initializeRest (/usr/src/app/dist/server/main.js:1:3385245)
    at /usr/src/app/dist/server/main.js:1:3382126
    at resolvePromise (/usr/src/app/dist/server/main.js:1:6702620)
    at /usr/src/app/dist/server/main.js:1:6700877
    at /usr/src/app/dist/server/main.js:1:6701192
    at ZoneDelegate.invoke (/usr/src/app/dist/server/main.js:1:6692914)
    at Object.onInvoke (/usr/src/app/dist/server/main.js:1:2569324)
    at ZoneDelegate.invoke (/usr/src/app/dist/server/main.js:1:6692810)
    at Zone.run (/usr/src/app/dist/server/main.js:1:6685328)
    at /usr/src/app/dist/server/main.js:1:6704218
    at ZoneDelegate.invokeTask (/usr/src/app/dist/server/main.js:1:6693846)
    at Object.onInvokeTask (/usr/src/app/dist/server/main.js:1:2569069)

For information : this error does not occur when we test SSR on localhost using the command mentioned in the official documentation : npm run build:ssr && npm run serve:ssr

"@angular/core": "9.0.0",
....
....
"@angular/fire": "5.4.2",
"firebase": "7.8.1",

Hi @jamesdaniels

You said

I’ll want to address for 6.0 stable.

Are you able to give us an approximate date on when the 6.0 stable will be live? is it few days or weeks?

Based on your answer, we will do or not a rollback to Angular 8 because it does not seem we can do SSR with Angular 9 and Firestore.

hiepxanh · 2020-02-11T01:57:51Z

@vroussel35 I suggest you rollback to angular 8 since he will be busy to update manything. everything will be alright after I test his new update

jamesdaniels · 2020-02-11T02:01:51Z

I am aiming to achieve success bundling us with Angular 9 SSR within a week. Depending on the day of the week I get it merged, other issues in the meantime, or how big that particular change is I may decide to cut another RC before 6.0 drops on @latest.

vroussel35 · 2020-02-11T02:05:55Z

Thanks @hiepxanh and @jamesdaniels for your quick replies - we will do our rollback to Angular 8, waiting for the 6.0 stable.

Thanks for all the great work you do !

rubenheymans · 2020-02-29T16:20:41Z

any update on a working ssr with the latest version and angular 9 ivy?

jamesdaniels · 2020-03-10T04:53:04Z

After much suffering I've managed to get this working!

I have a couple more things to clean up and will be cutting a new RC shortly. I had to add @firebase/firestore to externalDependencies and make some other baffling changes... honestly I'm not 100% sure how this is working but I'm going to roll with it.

It's very clear that NGCC does not like how Firestore is bundled. I'll grab some time with the JS SDK team when opportune.

hiepxanh · 2020-03-11T02:53:40Z

Congratulation for your contribution. :D

.. honestly I'm not 100% sure how this is working but I'm going to roll with it.

don't worrry, let's roll out and see how it work. I will test this as soon as you release

mc-lovin · 2020-03-17T14:33:14Z

Hoping for a quick release 🤞

tiagorvs · 2020-03-17T17:10:40Z

Hoping for a quick release 🤞

try the canary version for now.
npm i -s @angular/fire@canary

mc-lovin · 2020-03-21T14:54:16Z

@tiagorvs tried still getting the same error. ..

[2020-03-21T14:52:47.053Z]  @firebase/firestore: Firestore (7.11.0): INTERNAL UNHANDLED 

ERROR:  Error: ENOENT: no such file or directory, open 

'.../dist/server/src/protos/google/firestore/v1/firestore.proto'

mazlano27 · 2020-03-22T17:25:23Z

Hoping for a quick release 🤞

try the canary version for now.
npm i -s @angular/fire@canary

Getting this error when trying to pre-render with @angular/fire@canary →

Unhandled Promise rejection: Cannot read property 'id' of undefined ; Zone: ; Task: Promise.then ; Value: TypeError: Cannot read property 'id' of undefined

Is pre-rendering with Angular 9 + Firestore possible yet?

mc-lovin · 2020-03-23T03:58:17Z

Meanwhile managing with the firestore rest API https://firebase.google.com/docs/firestore/use-rest-api

documentation is terrible, but if you have simple use cases, you can save 60kb of bundle size

vroussel35 · 2020-03-23T10:01:05Z

Hi @jamesdaniels - without any pressure, are you able to give us a rough estimate of when @angular/fire v6 should be available ? (we need this input to plan our developments accordingly).
Thanks & Stay at home !

vroussel35 · 2020-03-27T11:32:57Z

Hi @jamesdaniels - is everything OK for you? Are you able to give us some news regarding the next release date?
Thanks

rubenheymans · 2020-03-27T18:40:59Z

@google-admin we could use some extra resources here

hiepxanh · 2020-03-28T01:43:17Z

@vroussel35
#2267 (comment)
In this comment, He said that:

Honestly adjusting to WFH, preparing for ng-conf, and the changes w/re to Google I/O and Cloud Next have ate up a lot of my time lately. Jumping back into Github now & will cut what I hope to be the last RC shortly. Aiming for 6.0 stable next week.

dannymorales · 2020-04-27T17:24:07Z

Hi Ruben Heymans,

I tried that several times and still does not work.

fayeyen · 2020-05-03T19:41:50Z

Please suggest which firebase version match the Angular 9 , good in SSR, I have problem with this any try many days can't figure it out. I also use google map api and geofirex, stuck in serve:ssr. Any help.
here's my version
"@angular/core": "~9.1.3",
"@angular/fire": "^6.0.0",
"firebase": "^7.14.2",
"geofirex": "^0.1.0",

I used
ng add @nestjs/ng-universal
and npm run build:ssr without error ,
but when npm run serve:ssr
error Error enabling offline persistence. Falling back to persistence disabled: Error: ENOENT: no such file or directory, open 'C:\myprojects\myproject9\dist\myproject9\server\src\protos\google\firestore\v1\firestore.proto'
If roll back work, I would rather roll back , pls suggest which version, should I install.
pls help..........help.....help.....I am stuckkk....

jdgamble555 · 2020-05-03T21:53:47Z

Please suggest which firebase version match the Angular 9 , good in SSR, I have problem with this any try many days can figure it out. I also use google map api and geofirex, stuck in serve:ssr. Any help.
here's my version
"@angular/core": "~9.1.3",
"@angular/fire": "^6.0.0",
"firebase": "^7.14.2",
"geofirex": "^0.1.0",

I used
ng add @nestjs/ng-universal
and npm run build:ssr without error ,
but when npm run serve:ssr
error Error enabling offline persistence. Falling back to persistence disabled: Error: ENOENT: no such file or directory, open 'C:\myprojects\myproject9\dist\myproject9\server\src\protos\google\firestore\v1\firestore.proto'
If roll back work, I would rather roll back , pls suggest which version, should I install.
pls help..........help.....help.....I am stuckkk....

Add @firebase/firestore to "package.json".dependencies

fayeyen · 2020-05-04T09:37:22Z

Please suggest which firebase version match the Angular 9 , good in SSR, I have problem with this any try many days can't figure it out. I also use google map api and geofirex, stuck in serve:ssr. Any help.
here's my version
"@angular/core": "~9.1.3",
"@angular/fire": "^6.0.0",
"firebase": "^7.14.2",
"geofirex": "^0.1.0",

I used
ng add @nestjs/ng-universal
and npm run build:ssr without error ,
but when npm run serve:ssr
error Error enabling offline persistence. Falling back to persistence disabled: Error: ENOENT: no such file or directory, open 'C:\myprojects\myproject9\dist\myproject9\server\src\protos\google\firestore\v1\firestore.proto'
If roll back work, I would rather roll back , pls suggest which version, should I install.
pls help..........help.....help.....I am stuckkk....

after I added @firebase/firestore to "package.json".dependencies
still got the error
my debug.log as follow
0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli 'C:\Program Files\nodejs\node.exe',
1 verbose cli 'C:\Users\faye_\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'serve:ssr'
1 verbose cli ]
2 info using npm@6.13.6
3 info using node@v12.14.1
4 verbose run-script [ 'preserve:ssr', 'serve:ssr', 'postserve:ssr' ]
5 info lifecycle myproject9@0.0.0preserve:ssr: myproject9@0.0.0
6 info lifecycle myproject9@0.0.0serve:ssr: myproject9@0.0.0
7 verbose lifecycle myproject9@0.0.0serve:ssr: unsafe-perm in lifecycle true
8 verbose lifecycle myproject9@0.0.0serve:ssr: PATH: C:\Users\faye_\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\myprojects\myproject9\node_modules.bin;C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\ProgramData\Oracle\Java\javapath;C:\Program Files (x86)\Intel\iCLS Client;C:\Program Files\Intel\iCLS Client;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files (x86)\Yarn\bin;C:\WINDOWS\System32\OpenSSH;C:\Program Files\Git\cmd;C:\Program Files\Common Files\Autodesk Shared;C:\Program Files\Microsoft SQL Server\120\Tools\Binn;C:\Program Files\Intel\WiFi\bin;C:\Program Files\Common Files\Intel\WirelessCommon;C:\Program Files\nodejs;C:\Program Files\Microsoft VS Code\bin;C:\Users\faye_\AppData\Local\Microsoft\WindowsApps;C:\Users\faye_\AppData\Roaming\npm;
9 verbose lifecycle myproject9@0.0.0serve:ssr: CWD: C:\myprojects\myproject9
10 silly lifecycle myproject9@0.0.0serve:ssr: Args: [ '/d /s /c', 'node dist/myproject9/server/main.js' ]
11 silly lifecycle myproject9@0.0.0serve:ssr: Returned: code: 3221225725 signal: null
12 info lifecycle myproject9@0.0.0serve:ssr: Failed to exec serve:ssr script
13 verbose stack Error: myproject9@0.0.0 serve:ssr: node dist/myproject9/server/main.js
13 verbose stack Exit status 3221225725
13 verbose stack at EventEmitter. (C:\Users\faye_\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\index.js:332:16)
13 verbose stack at EventEmitter.emit (events.js:223:5)
13 verbose stack at ChildProcess. (C:\Users\faye_\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack at ChildProcess.emit (events.js:223:5)
13 verbose stack at maybeClose (internal/child_process.js:1021:16)
13 verbose stack at Process.ChildProcess.handle.onexit (internal/child_process.js:283:5)
14 verbose pkgid myproject9@0.0.0
15 verbose cwd C:\myprojects\myproject9
16 verbose Windows_NT 10.0.18362
17 verbose argv "C:\Program Files\nodejs\node.exe" "C:\Users\faye\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js" "run" "serve:ssr"
18 verbose node v12.14.1
19 verbose npm v6.13.6
20 error code ELIFECYCLE
21 error errno 3221225725
22 error myproject9@0.0.0 serve:ssr: node dist/myproject9/server/main.js
22 error Exit status 3221225725
23 error Failed at the myproject9@0.0.0 serve:ssr script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 3221225725, true ]

hiepxanh · 2020-05-04T12:01:07Z

@fayeyen they close my issues, so I close my PR #2372
little dissappoint but here is the solution:

SOLUTION:

Description
update for angular 9.0 match with https://angular.io/guide/universal

Code sample
example repository here https://github.com/hiepxanh/angular-fire-universal

SNIPPET:

1. Edit file

Insert polyfills at the top of file

// server.ts
...
// Polyfills required for Firebase
(global as any).WebSocket = require('ws');
(global as any).XMLHttpRequest = require('xhr2');
...

// angular.json
// projects.web.architect
...
 "server": {
          "builder": "@angular-devkit/build-angular:server",
          "options": {
            ...
            "externalDependencies": [
              "@firebase/firestore"
            ]
            ...
          }


...

2. Setup Firebase detail

follow this guilde https://github.com/angular/angularfire/blob/master/docs/install-and-setup.md

3. Running

npm run dev:ssr

NaqeebZareen · 2020-05-04T18:34:23Z

Any solution regarding to this error?

node dist/server

//dist/server/main.js:23730
throw err;
^

Error: ENOENT: no such file or directory, open 'google/protobuf/api.proto'
at Object.openSync (fs.js:448:3)
at Object.readFileSync (fs.js:348:35)

fayeyen · 2020-05-04T18:53:47Z

@hiepxanh thank you! I'm trying your git version, is it an empty project which work on SSR?

fayeyen · 2020-05-05T08:25:38Z

Thank you for help, the seed seem's fine. But when I added the auth and storage module in app.module.ts
AngularFireAuthModule,
AngularFireStorageModule,

it came out with error

fayeyen · 2020-05-05T08:52:27Z

Thank you! It works! by upgrade the firebase version
"firebase": "^7.14.2"
Appreciated!

hiepxanh · 2020-05-05T11:21:38Z

@fayeyen thank you. You're welcome. Please share your solution, so other people can get help from your answer

addsmoll · 2020-05-10T21:02:49Z

@FredvanRijswijk Root route resolvers easily break the entire server.

mazlano27 · 2020-06-14T13:59:51Z

@mazlano27 you need to polyfill WS and XMLHttpRequest as they are not available in Node. https://github.com/angular/angularfire/blob/master/sample/server.ts#L11 I've tested against the xhr2 and ws Node packages.

Hey @james,

I've gone back and tried to update the firebase package to 7.15.1 and the error "app.firestore is not a function" still persists. As before, falling back to 7.8.0 fixes the issue. What update can we make to have pre-rendering working for newer firebase versions? Thank you

vroussel35 · 2020-06-18T14:53:40Z

Hi everyone,

We want to start the migration to Angular 9 for our platform which is using SSR + Angularfire.

Simple question : Is "Angular 9 + SSR + Angularfire" working?

Looking at all the comments above, I'm not sure if this setup is working for anyone. Would be great to know before starting spending time and money on this migration.

Thanks.

yasinkocak · 2020-06-18T19:22:50Z

Yes it's worked but u can wait on angularfire 6.1 there are little bugs but workaround is possible to getting works

epiphanatic · 2020-06-18T20:43:07Z

It definitely works and I have deployed an app to production, there are just so many little things you have to get right or page won't load (eg you need to only execute anything auth related if browser), data from database won't get retrieved in time to be SSR'd (a task scheduler may be needed), or a number of other things you won't find in any documentation or tutorials floating around. I spent weeks getting mine working with my particular setup. But it is possible.

yasinkocak · 2020-06-18T21:15:17Z

Can you share the details or update the documentations @epiphanatic ?

epiphanatic · 2020-06-18T23:05:12Z

@yasinkocak well, part of what I'm getting at here is that it's not that simple. I would love to write a Medium article, but I can't just write up a general solution because 1) people have very different setups, and 2) all of this keeps changing so fast (eg what external dependencies to include or not and which exact package name, among others). You simply have to put in the time reading SO regarding specific issues you are facing, understanding the specifics of how each individual piece works, comparing all that to the exact versions of things being used in examples you see, and so on. Maybe soon SSR + Firebase + SEO (another issue all itself) will be a simple plug and play thing, but for now it is not.

hiepxanh · 2020-06-19T15:20:40Z

@epiphanatic did U try this #2320 (comment)

rvbiljouw · 2020-07-06T13:33:11Z

Any solution regarding to this error?

node dist/server

//dist/server/main.js:23730
throw err;
^

Error: ENOENT: no such file or directory, open 'google/protobuf/api.proto'
at Object.openSync (fs.js:448:3)
at Object.readFileSync (fs.js:348:35)

Seeing the same issue here - did you find a solution?

jdgamble555 · 2020-07-06T15:31:21Z

That particular error happens when you don't have @firebase/firestore added to your module. @rvbiljouw

vroussel35 · 2020-07-30T11:45:41Z

data from database won't get retrieved in time to be SSR'd (a task scheduler may be needed)...

Hi @epiphanatic: are you able to show us a demo or a way to do it for the "data from database won't get retrieved in time to be SSR'd (a task scheduler may be needed)" as we are facing timeout errors since we've updated to angularfire 6+.

Can you confirm that you were successful with a simple task like retrieving data from firestore (using promise or observable) and SSR'd them?

epiphanatic · 2020-07-30T21:31:23Z

@vroussel35 yes, I am able to anything that you would normally do with the database and SSR will work as well as being able to retrieve metadata (if you've set that up in your code). I just followed this https://stackoverflow.com/questions/47151811/server-does-not-wait-till-http-call-completes-before-rendering-angular-4-serve. Just wrap whatever DB call you want to be SSRd or put in metadata in that service.

I'm not saying this is the best way, or that it can't work without it, I just personally could not find another way to do it if the goal is to do this stuff with dynamic content / routes. But from what I understand, you could do all this otherwise if you are using prerendering and content / routes are known beforehand (see fireship.io).

It would be nice if the AngularFire team could build something like this in assuming this is indeed a requirement and not just my amateur-ness ;)

waterplea · 2020-11-24T19:04:51Z

Sorry to dig this up, but I'm having issues with firebase, @angular/fire and Universal. It was working for me for following versions:

"@angular/fire": "6.0.3",
"firebase": "7.14.1",

Now I have updated to the latest 6.1.1 and 8.1.1 accordingly and when I open SSR built page I get this error in server console:

ERROR Error: Uncaught (in promise): TypeError: app.firestore is not a function
TypeError: app.firestore is not a function

Any ideas what could this be? My app is rather basic :(

mazlano27 · 2020-11-25T01:51:12Z

Sorry to dig this up, but I'm having issues with firebase, @angular/fire and Universal. It was working for me for following versions:
"@angular/fire": "6.0.3",
"firebase": "7.14.1",
Now I have updated to the latest 6.1.1 and 8.1.1 accordingly and when I open SSR built page I get this error in server console:
ERROR Error: Uncaught (in promise): TypeError: app.firestore is not a function
TypeError: app.firestore is not a function
Any ideas what could this be? My app is rather basic :(

I faced a similar issue. 2 things helped me:

Removing firestore from external dependencies angular.json
Downgrading firebase to 8.0.x

jdgamble555 · 2020-11-25T02:22:23Z

@waterplea Make sure you update the way you import firebase to this:

import firebase from 'firebase/app';

waterplea · 2020-11-25T09:51:18Z

@jdgamble555 I did update it this way in my login component, so I can call new firebase.auth.GoogleAuthProvider() but for Firestore I only have this in my main module:

import 'firebase/firestore';

Do I need to change it somehow?

@mazlano27 If I do that I'm getting this error when I open route that uses firestore:

[2020-11-25T09:48:03.294Z]  @firebase/firestore: Firestore (8.0.2): INTERNAL UNHANDLED ERROR:  Error: ENOENT: no such file or directory, open 'XXX\server\src\protos\google\firestore\v1\firestore.proto'

waterplea · 2020-11-25T11:28:42Z

All right, this issue has helped me:
firebase/firebase-js-sdk#3541

Apparently, you now need to also add @firebase/app to externalDependencies too. I'm facing more issues but they seem to be unrelated to this anymore.

michaeljpeake · 2021-02-09T10:23:48Z

Hi there. A lot of content to consume on this page and I'm a noob when it comes to SSR.

Is the conclusion that you get this error because there are files required for firebase (e.g. @firebase/app and @firebase/firestore) that aren't included for SSR unless you add them explicitly to externalDependencies?

I've added the two dependencies above in the server block in my angular.json and everything seems to work perfectly now. I was a little disappointed that didn't work out the box with ng add @nestjs/ng-universal. However, it seems an easy enough fix ... did I miss it being documented somewhere?

hiepxanh changed the title ~~Angular Ivy + Firestore have trouble with Universal~~ Angular Ivy 9.0 stable and angularfire RC1 using Firestore have trouble with Universal Feb 7, 2020

hiepxanh mentioned this issue Feb 7, 2020

Critical dependency: the request of a dependency is an expression | UnhandledPromiseRejectionWarning: Error: package.json does not exist #2284

Closed

zbream mentioned this issue Feb 23, 2020

Build Universal app shell fails with error. zbream/oss-tracker#3

Closed

jamesdaniels mentioned this issue Mar 10, 2020

universal prerendering fails with: import 'firebase/firestore' #2350

Closed

This was referenced Jun 2, 2020

(Universal) Update getting-started.md #2372

Closed

Cannot find module 'firebase/analytics' #2476

Closed

Angular Ivy 9.0 stable and angularfire RC1 using Firestore have trouble with Universal #2320

Angular Ivy 9.0 stable and angularfire RC1 using Firestore have trouble with Universal #2320

Comments

hiepxanh commented Feb 7, 2020 • edited Loading

Version info

How to reproduce these conditions

Debug output

Expected behavior

Actual behavior

Updated

Updated 1

update 3:

mazlano27 commented Feb 7, 2020

jamesdaniels commented Feb 7, 2020

hiepxanh commented Feb 8, 2020

hiepxanh commented Feb 8, 2020

mazlano27 commented Feb 8, 2020

hiepxanh commented Feb 8, 2020

hiepxanh commented Feb 8, 2020 • edited Loading

tiagorvs commented Feb 8, 2020

hiepxanh commented Feb 8, 2020

vroussel35 commented Feb 9, 2020

vroussel35 commented Feb 11, 2020

hiepxanh commented Feb 11, 2020

jamesdaniels commented Feb 11, 2020

vroussel35 commented Feb 11, 2020

rubenheymans commented Feb 29, 2020

jamesdaniels commented Mar 10, 2020

hiepxanh commented Mar 11, 2020 • edited Loading

mc-lovin commented Mar 17, 2020

tiagorvs commented Mar 17, 2020

mc-lovin commented Mar 21, 2020

mazlano27 commented Mar 22, 2020

mc-lovin commented Mar 23, 2020

vroussel35 commented Mar 23, 2020

vroussel35 commented Mar 27, 2020

rubenheymans commented Mar 27, 2020

hiepxanh commented Mar 28, 2020

dannymorales commented Apr 27, 2020

fayeyen commented May 3, 2020 • edited Loading

jdgamble555 commented May 3, 2020

fayeyen commented May 4, 2020

hiepxanh commented May 4, 2020 • edited Loading

SOLUTION:

SNIPPET:

1. Edit file

2. Setup Firebase detail

3. Running

NaqeebZareen commented May 4, 2020

fayeyen commented May 4, 2020

fayeyen commented May 5, 2020 • edited Loading

fayeyen commented May 5, 2020

hiepxanh commented May 5, 2020

addsmoll commented May 10, 2020 • edited Loading

mazlano27 commented Jun 14, 2020

vroussel35 commented Jun 18, 2020

yasinkocak commented Jun 18, 2020

epiphanatic commented Jun 18, 2020

yasinkocak commented Jun 18, 2020

epiphanatic commented Jun 18, 2020 • edited Loading

hiepxanh commented Jun 19, 2020

rvbiljouw commented Jul 6, 2020

jdgamble555 commented Jul 6, 2020

vroussel35 commented Jul 30, 2020

epiphanatic commented Jul 30, 2020

waterplea commented Nov 24, 2020

mazlano27 commented Nov 25, 2020

jdgamble555 commented Nov 25, 2020

waterplea commented Nov 25, 2020

waterplea commented Nov 25, 2020 • edited Loading

michaeljpeake commented Feb 9, 2021

hiepxanh commented Feb 7, 2020 •

edited

Loading

hiepxanh commented Feb 8, 2020 •

edited

Loading

hiepxanh commented Mar 11, 2020 •

edited

Loading

fayeyen commented May 3, 2020 •

edited

Loading

hiepxanh commented May 4, 2020 •

edited

Loading

fayeyen commented May 5, 2020 •

edited

Loading

addsmoll commented May 10, 2020 •

edited

Loading

epiphanatic commented Jun 18, 2020 •

edited

Loading

waterplea commented Nov 25, 2020 •

edited

Loading