/ Angular

Angular 5 - Weirdest Bug Ever.

I was trying to compile my Angular 5 application and I kept getting a REALLY annoying error:

Uncaught ReferenceError: Observable_1 is not defined

Naturally I decided to go through my package.json and make sure my dependencies were all in order. After a couple hours of pain stakingly googling any known errors between Angular 5.2.7, rxjs, typescript and the like, I still had the same error!

So, put on my debugger hat!

It only ever found ONE error and it was always in my API Services.
Firstly it directed me to my User Service. Particularily the function:

getMyOffers(@Optional() query: any = {}): Observable<any> {
    return this._service.get('/me/offers', query).map(data => data);

I decided to do what any cheating web dev would do and delete the :Observable<any> from the line. Lo and behold, the error was gone! However it brought me to my next service...

getSales(@Optional() query: any = {}): Observable<any> {
    return this._service.get('/sales', query).map(data => data);

That's where I noticed a pattern.
Observable was getting translated into Observable_1 on any line where the @Optional() flag existed.


Well. I stepped through my application and removed all instances of @Optional() and BOOM.
The app works just fine and ng build --prod no longer fails.

I'm going to raise an issue and hopefully get an answer, but until then hopefully this can help someone else out!