Whenever I try to start up my web app, I get this Type error. Can't figure out why.
I started to get it after I updated some packages. I can't figure out which one was the problem or why the code that the error points to give wrong as it is code in my dependencies for Angular 8. I am not really sure what the error is even telling me. I have tried to update all dependencies. I have looked at almost all the similar question solutions and they have not worked. I can't tell if it is a compiler error, typescript, or a dependency error.
ERROR
[error] TypeError: Object prototype may only be an Object or null: undefined
at setPrototypeOf (<anonymous>)
at Object.__extends (C:\Users\leahb\Desktop\NH\NH-Senior-Project\node_modules\tslib\tslib.js:65:9)
at C:\Users\leahb\Desktop\NH\NH-Senior-Project\node_modules\@angular\compiler-cli\src\ngtsc\indexer\src\template.js:115:17
tslib.js at line 65
(function (exporter) {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
__extends = function (d, b) {
extendStatics(d, b); *//saying the error is coming from here*
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
PACKAGE.JSON
{
"name": "nh",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"heroku-postbuild": "ng build --prod"
},
"keywords": [
"heroku"
],
"private": true,
"dependencies": {
"@agm/core": "^1.0.0-beta.6",
"@angular-devkit/build-angular": "^0.13.0",
"@angular/animations": "~8.1.2",
"@angular/common": "~8.1.2",
"@angular/core": "~8.1.2",
"@angular/forms": "~8.1.2",
"@angular/platform-browser": "~8.1.2",
"@angular/platform-browser-dynamic": "~8.1.2",
"@angular/router": "~8.1.2",
"@types/googlemaps": "^3.37.0",
"core-js": "^2.5.4",
"font-awesome": "^4.7.0",
"hammerjs": "^2.0.8",
"ngx-gallery": "^5.10.0",
"rxjs": "~6.5.2",
"tslib": "^1.9.0",
"zone.js": "^0.9.1"
},
"devDependencies": {
"@angular/cli": "^7.3.9",
"@angular/compiler": "^7.2.15",
"@angular/compiler-cli": "^8.1.2",
"@angular/language-service": "~8.1.2",
"@types/jasmine": "~2.8.8",
"@types/jasminewd2": "~2.0.3",
"@types/node": "~8.9.4",
"codelyzer": "~4.5.0",
"enhanced-resolve": "^3.3.0",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "^3.4.5"
},
"engines": {
"node": "10.16.0",
"npm": "6.9.0"
}
}
I expected the app to compile, build, and start up. Whenever I tried ng serve, ng test, or ng build I get this error.
I had the same problem with my angular@7 project after updating the CLI globally to version 8 and solve it by upgrading angular in my project to the latest version by running this command in my project directory:
ng update @angular/cli @angular/core
You can also use the allow-dirty flag to bypass the repo check:
ng update @angular/cli @angular/core --allow-dirty
Also, there are other things to watch for when upgrading that has mentioned here: https://update.angular.io/#7.0:8.0
Using the flag allow-dirty allows you to bypass the repo check.
ng update @angular/cli @angular/core --allow-dirty
To Ionic users: In my case, the problem was the incompatibility between current angular/ionic cli's version and angular/ionic app's version.
Steps to solve:
1) Create a new project with ionic version 3, then compare the files packages.json.
ionic start Ionic3Project blank --type=ionic-angular
2) Inside Ionic3Project folder, build android
ionic cordova build android --prod
3) Open the packages.json of your main project and change the following versions of dependencies:
"@angular/*"
"@ionic-native/*"
"rxjs"
Also, replace the "scripts" part.
4) Delete your node_modules folder.
5) Delete your platform android folder (the entire platform folder or just android folder).
6) Run npm install
7) Add platform android
ionic cordova platform add android
8) Build your app again
ionic cordova build android --prod
After follow these steps, I could build my app again.
Obs.: It's possible you got some issues related to plugins between these steps. In this case, you might need re-install the plugin(s). Do it and keep those steps in mind. Try to remove and re-add android after re-install the plugins.
I got the same error in my Angular app when running tests with ng test.
In my case, the cause of the issue was circular dependencies.
I had two classes that were part of some index.ts, but one of them imported the other one using the same index. This was causing a circular dependency because as a result of it the index.ts was imported multiple times.
Once removed the circular dependency, everything worked fine.
I was inspired by: https://stackoverflow.com/a/53123468/3497671
In my Ionic App i downgraded the Angular CLI from 8.x.x to 5.2.11 using npm i @angular/compiler-cli@5.2.11 and it worked
I had the issue and read Francesco Borzi answer and found out that the order of imports may have importance :
I use an index.ts in the index.ts I import any local './*' Class then exports them at once the order of imports was
import { Class2 } from './class2';
import { Class1 } from './class1';
and in Class2 I would have a
import Class1 from '.'
export Class2 extends Class1
It was trying to first compile Class2 and Class2 refers Class1. I inverted the imports in index.ts and it works now
This happened to me on Angular 9 so I will leave this answer here for folks looking for a fix on that version... I fixed it by removing the node_modules folder and reinstalling. This ensured that ngcc was forced to recompile the dependencies. Just ensure that your postinstall, NPM script looks like this:
"postinstall": "ngcc"
I had the same issue fixed this way:
npm i @angular/compiler-cli@~8.0.0