Can't update firebase function to node 12 in Angular Universal app with AngularFire

Question

I followed this tutorial to deploy Angular Universal to a firebase function and deploy with Firebase: https://medium.com/@chris.duebbert/angular-9-universal-firebase-deploy-8d8d47244e1c

Everything worked fine until I add AngularFireModule to my app.module.ts. Then when I run 'ng deploy' using node 12 I get the following error in the logs of my 'ssr' function:

Provided module can't be loaded. Is there a syntax error in your code? Detailed stack trace: ReferenceError: globalThis is not defined

When I try with my local node version set to 10 I get the same error directly in my terminal.

Apparently, Firebase uses globalThis which requires node version 12 (Angular 11 run on SSR @nguniversal/express-engine ReferenceError: globalThis is not defined). I added the following to my /functions/package.json:

app.module.ts

    "engines": {
        "node": "12"
      },

I can put any number for node version and my SSR function is still deploying with node 10 and the 'globalThis' error continues. I'm using Firebase's Blaze plan. Here's my app.module.ts:

    @NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        BrowserModule.withServerTransition({ appId: 'serverApp' }),
        AppRoutingModule,
        NoopAnimationsModule,
        FormsModule,
        NgxTwitterTimelineModule,
        AngularFireModule.initializeApp(config),
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

functions/package.json

    {
      "name": "functions",
      "scripts": {
        "lint": "tslint --project tsconfig.json",
        "build": "tsc",
        "serve": "npm run build && firebase emulators:start --only functions",
        "shell": "npm run build && firebase functions:shell",
        "start": "npm run shell",
        "deploy": "firebase deploy --only functions",
        "logs": "firebase functions:log"
      },
      "engines": {
        "node": "12"
      },
      "main": "lib/index.js",
      "dependencies": {
        "firebase-admin": "^9.4.2",
        "firebase-functions": "^3.13.0",
        "grpc": "^1.24.4"
      },
      "devDependencies": {
        "tslint": "^5.12.0",
        "typescript": "^3.8.0",
        "firebase-functions-test": "^0.2.0"
      },
      "private": true
    }

Answer 1

You need to polyfill globalThis https://github.com/angular/angularfire#polyfills

Answer 2

Two weeks looking for a solution, until I have found this question/answer. Thank you!

Steps to solve the problem:

> npm install globalthis

on server.ts file:

import 'globalthis/auto';