Unable to retrieve data from firebase database into heroku app

I've created a angular app: todolistapp. The tasks are being saved in a firebase database and can be seen under Your Tasks heading.

The application is working fine on localhost but after deploying it on heroku, It is not showing the tasks. Check this screenshot.

What am I doing wrong?

This is the full error shown in the screenshot:

ERROR TypeError: Ia.Observable is not a constructor
    at Aa (main.c0eb70b5514f5eed42fe.js:1)
    at main.c0eb70b5514f5eed42fe.js:1
    at Fa (main.c0eb70b5514f5eed42fe.js:1)
    at Object.snapshotChanges (main.c0eb70b5514f5eed42fe.js:1)
    at t.ngOnInit (main.c0eb70b5514f5eed42fe.js:1)
    at Ne (main.c0eb70b5514f5eed42fe.js:1)
    at Oe (main.c0eb70b5514f5eed42fe.js:1)
    at xe (main.c0eb70b5514f5eed42fe.js:1)
    at Hn (main.c0eb70b5514f5eed42fe.js:1)
    at ur (main.c0eb70b5514f5eed42fe.js:1)

package.json

{
  "name": "todolistapp",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "node server.js",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "heroku-postbuild": "ng build --prod"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~10.1.1",
    "@angular/common": "~10.1.1",
    "@angular/compiler": "~10.1.1",
    "@angular/core": "~10.1.1",
    "@angular/forms": "~10.1.1",
    "@angular/platform-browser": "~10.1.1",
    "@angular/platform-browser-dynamic": "~10.1.1",
    "@angular/router": "~10.1.1",
    "angularfire2": "^5.0.0-rc.3",
    "express": "^4.17.1",
    "firebase": "^4.6.1",
    "path": "^0.12.7",
    "rxjs": "~6.6.0",
    "rxjs-compat": "^6.6.3",
    "tslib": "^2.0.0",
    "typescript": "~4.0.2",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1001.1",
    "@angular/cli": "~10.1.1",
    "@angular/compiler-cli": "~10.1.1",
    "@types/node": "^12.11.1",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.0.2"
  },
  "engines": {
    "node": "12.16.2",
    "npm": "6.14.4"
  }
}

environment.prod.ts

export const environment = {
  production: true,
  firebase: {
    apiKey: "SOME_CREDENTIALS",
    authDomain: "SOME_CREDENTIALS",
    databaseURL: "SOME_CREDENTIALS",
    projectId: "SOME_CREDENTIALS",
    storageBucket: "SOME_CREDENTIALS",
    messagingSenderId: "SOME_CREDENTIALS",
    appId: "SOME_CREDENTIALS",
    measurementId: "SOME_CREDENTIALS"
  }
};

server.js

//Install express server
const express = require('express');
const path = require('path');

const app = express();

// Serve only the static files form the dist directory
app.use(express.static(__dirname + '/dist/todolistapp'));

app.get('/*', function(req,res) {

res.sendFile(path.join(__dirname+'/dist/todolistapp/index.html'));
});

// Start the app by listening on the default Heroku port
app.listen(process.env.PORT || 8080);