When I add import { AngularFireFunctions } from '@angular/fire/compat/functions';
to a component, the second that component loads, the entire frontend crashes fatally with the following error. I remove that import and everything goes back to working smoothly.
[vite] Error when evaluating SSR module [...] .angular/cache/18.1.3/vite/deps_ssr/@angular_fire_compat_functions.js
TypeError: Class extends value undefined is not a constructor or null
at node_modules/@firebase/functions/node_modules/undici/lib/fetch/file.js
I've seen solutions removing SSR, but I don't want to do that, and according to this page, @angular/fire
is compatible with SSR rendering.
In angular.json
I have
"build": {
"builder": "@angular-devkit/build-angular:application",
"options": {
...
"polyfills": ["@angular/localize/init", "zone.js"],
...
"scripts": [],
"server": "src/main.server.ts",
"prerender": true,
"ssr": {
"entry": "server.ts"
}
In package.json
, I have
"@angular/ssr": "^18.1.3",
"@angular/fire": "^18.0.1",
I'm using Angular 18.1.2 and Node.js v20.11.0. Any help will be greatly appreciated.
As @SandeepVokkareni suggested, upgrading node to the latest version (v22.6.0
) did solve this issue for me, but only after removing the node-modules
folder, the package-lock.json
file, and reinstalling all packages with npm i --legacy-peer-deps --save
. I wonder if deleting the folder and reinstalling the packages without the node version upgrade would have done the trick.