Angular: 7.2.1 ES6 class ReferenceError : Cannot access 'X' before initialization

Question

I\'m having the following TypeScript class

export class Vehicule extends TrackableEntity {
  vehiculeId: number;
  constructor() {
    super();
    return s         


        

Answer 1

in Angular 8, having entryComponent declared as an empty list in a SharedModule caused this issue for me

entryComponent: []

after removing entryComponent, everything worked fine

Answer 2

You're probably running into this Angular issue: https://github.com/angular/angular-cli/issues/15077.

From that issue:

Hi, is there a reason why you need emitDecoratorMetadata to be true?

This TypeScript option has a fundamental design limitation with ES2015+ code and is best avoided when targeting such output. As such this is an issue with TypeScript itself and not Angular.

Angular 8+ no longer requires the option. It was also previously only required for JIT mode which is typically only used in development.

The solution is to set "emitDecoratorMetadata": false in your tsconfig.json file.

Side note: I must say, given that previous versions of the Angular CLI automatically added emitDecoratorMetadata: true, and there's no reason I can see why a dev should know that emitDecoratorMetadata should now be false, it's pretty horrible that the Angular team basically said "this isn't our problem" and closed the issue without action. This could have been easily "fixed" by adding some better documentation (as pointed out by someone in the linked issue).

Answer 3

I was getting this error due to a circular dependency, like

• A injected with B
• B injected with C
• C injected with A

Removing the circular dependecy fixed this error.

Answer 4

that make sense, you are passing the local object (Vehicle) to the parent class within constructor return super.proxify(this);.

Keep in mind the local Vehicle instance has not been instantiated yet (constructor block is not finished yet), so you cannot use this object in the mean time, you need to wait the constructor to done it's job.

Answer 5

Note that this error can also be caused by defining two public @Injectable classes within the same .ts file.

I've tripped over this more than once when I'm just prototyping stuff locally (especially when refactoring one service into multiple).

Setting emitDecoratorMetadata: false does fix this situation as well; but in case you're in a hurry to fix something or don't want fiddle with thetsconfig.json file on a large project - it's useful to know that you might be able to fix it by just copying one of the classes into a new file.