I recently upgraded to angular 11 and for some reason my translations stopped working in production mode. After the upgrade when I open my app in debug, all of my translations are empty but I do have some errors. Everything works fine in dev but in production I get a couple errors which are:
main.js:formatted:17916 ERROR TypeError: Cannot read property 'create' of undefined
at t.get (main.js:formatted:29367)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:62513)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
Tt @ main.js:formatted:17916
main.js:formatted:17916 ERROR TypeError: Cannot read property 'create' of undefined
at t.get (main.js:formatted:29367)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:62531)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
Tt @ main.js:formatted:17916
main.js:formatted:17916 ERROR TypeError: Cannot read property 'of' of undefined
at t.get (main.js:formatted:29380)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:62555)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
Tt @ main.js:formatted:17916
main.js:formatted:17916 ERROR TypeError: Cannot read property 'of' of undefined
at t.get (main.js:formatted:29380)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:62579)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
Tt @ main.js:formatted:17916
main.js:formatted:17916 ERROR TypeError: Cannot read property 'of' of undefined
at t.get (main.js:formatted:29380)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:62603)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
Tt @ main.js:formatted:17916
main.js:formatted:17916 ERROR TypeError: Cannot read property 'of' of undefined
at t.get (main.js:formatted:29380)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:62629)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
Tt @ main.js:formatted:17916
main.js:formatted:40061 In home component - onInit merchant:
main.js:formatted:29600 each event url :/serverOrder
main.js:formatted:17916 ERROR TypeError: Cannot read property 'of' of undefined
at t.get (main.js:formatted:29380)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:40348)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
Tt @ main.js:formatted:17916
main.js:formatted:17916 ERROR TypeError: Cannot read property 'of' of undefined
at t.get (main.js:formatted:29380)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:62747)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
Tt @ main.js:formatted:17916
main.js:formatted:7596 [WDS] Live Reloading enabled.
main.js:formatted:7640 [WDS] Warnings while compiling.
warnings @ main.js:formatted:7640
2main.js:formatted:7646 Conflict: Multiple assets emit different content to the same filename 3rdpartylicenses.txt
warnings @ main.js:formatted:7646
main.js:formatted:17916 ERROR TypeError: Cannot read property 'of' of undefined
at t.get (main.js:formatted:29380)
at t.updateValue (main.js:formatted:29480)
at t.transform (main.js:formatted:29502)
at Object.updateRenderer (main.js:formatted:52939)
at Object.updateRenderer (main.js:formatted:22658)
at Pr (main.js:formatted:21728)
at Vr (main.js:formatted:22090)
at jr (main.js:formatted:22075)
at Pr (main.js:formatted:21724)
at Vr (main.js:formatted:22090)
my package.json is:
{
"name": "app",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"main": "server.js",
"heroku-postbuild": "ng build --prod",
"preinstall": "npm install -g @angular/cli @angular/compiler-cli typescript",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular-devkit/core": "^11.0.5",
"@angular-devkit/schematics": "^11.0.5",
"@angular/animations": "^11.0.5",
"@angular/cdk": "^11.0.3",
"@angular/common": "^11.0.5",
"@angular/compiler": "11.0.5",
"@angular/compiler-cli": "^11.0.5",
"@angular/core": "^11.0.5",
"@angular/flex-layout": "^11.0.0-beta.33",
"@angular/forms": "^11.0.5",
"@angular/localize": "^11.0.5",
"@angular/material": "^11.0.3",
"@angular/platform-browser": "11.0.5",
"@angular/platform-browser-dynamic": "11.0.5",
"@angular/router": "11.0.5",
"@ng-bootstrap/ng-bootstrap": "^5.3.1",
"@ng-bootstrap/schematics": "^2.0.0-alpha.1",
"@ngtools/webpack": "^11.0.5",
"@ngx-translate/core": "8.0.0",
"@ngx-translate/http-loader": "^4.0.0",
"@types/chart.js": "^2.7.42",
"@types/express": "^4.17.0",
"@types/w3c-web-usb": "^1.0.4",
"@types/web-bluetooth": "0.0.4",
"angular-bootstrap-md": "^7.4.3",
"angular-cc-library": "^2.0.1",
"angular-notifier": "^4.1.1",
"angular5-csv": "^0.2.11",
"bcryptjs": "^2.4.3",
"body-parser": "^1.18.3",
"bootstrap": "^4.5.3",
"chart.js": "^2.5.0",
"core-js": "^2.5.4",
"cors": "^2.8.5",
"css-loader": "^2.1.0",
"dotenv": "^6.1.0",
"express": "^4.16.4",
"express-jwt": "^5.3.1",
"font-awesome": "^4.7.0",
"fontawesome": "^5.6.3",
"got": "^11.8.1",
"hammerjs": "^2.0.8",
"jsonwebtoken": "^8.2.2",
"lodash": "^4.17.11",
"mat-table-exporter": "^1.0.2",
"material-design-lite": "^1.3.0",
"mongodb": "^3.0.10",
"mongoose": "^5.1.4",
"ng-multiselect-dropdown": "^0.2.3",
"ng-thermal-print": "^1.0.3",
"ngx-bootstrap": "^6.2.0",
"node-sass": "^4.14.1",
"path": "^0.12.7",
"popper.js": "^1.15.0",
"pusher": "^2.2.0",
"pusher-js": "^4.4.0",
"readable-stream": "^3.6.0",
"remote-pay-cloud": "3.1.0",
"remote-pay-cloud-api": "^4.0.3",
"request": "^2.88.2",
"request-promise": "^4.2.4",
"resize-base64": "^1.0.12",
"rootpath": "^0.1.2",
"rxjs": "^6.5.2",
"rxjs-compat": "^6.3.3",
"tslib": "^1.9.0",
"typescript": "4.0.5",
"uuid": "^3.3.2",
"web-animations-js": "^2.3.2",
"zone.js": "~0.10.3"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.1100.5",
"@angular/cli": "11.0.5",
"@angular/language-service": "^11.0.5",
"@fortawesome/fontawesome-free": "^5.15.1",
"@types/jasmine": "~2.8.6",
"@types/jasminewd2": "~2.0.3",
"@types/lodash": "^4.14.135",
"@types/node": "^8.10.66",
"@types/uuid": "^8.3.0",
"angular-cli-ghpages": "^0.6.2",
"codelyzer": "^5.0.1",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~5.1.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.0",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "^7.0.0",
"ts-node": "~5.0.1",
"tslint": "~6.1.3"
},
"engines": {
"node": "10.13",
"npm": "6.9.0"
}
}
Upgrade ur ngx-translate package version from v8 to v13 which supports angular 10+
"@ngx-translate/core": "13.0.0",