1

I am trying to build the production version of my Angular 8 app, but I'm constantly getting Property '*' does not exist on type '*' errors.

Executed command:

ng build --prod="true" --verbose=true

Received errors:

ERROR in src/app/shared/layout/sidenav/sidenav.component.html(1,46): : Property 'always' does not exist on type 'SidenavComponent'.
src/app/shared/layout/sidenav/sidenav.component.html(1,97): : Property 'scrollViewExtras' does not exist on type 'SidenavComponent'.
src/app/shared/layout/sidenav/sidenav.component.html(1,128): : Property 'scrollBarExtras' does not exist on type 'SidenavComponent'.
src/app/shared/layout/sidenav/sidenav.component.html(10,41): : Property 'sidenav' is private and only accessible within class 'SidenavComponent'.

These are the first 3 rows of src/app/shared/layout/sidenav/sidenav.component.html:

<ng-scrollbar class="notice-board-scrollbar" [shown]="always" [compact]="true" [invertY]="true" [viewClass]="scrollViewExtras" [barClass]="scrollBarExtras">
  <cdk-virtual-scroll-viewport ngScrollbarView smoothScroll itemSize="100">
    <mat-list role="list">

If I build without the --prod="true" flag or I execute ng serve, it compiles without errors.

riverman@vscode:~/projects/front$ ng version  

Angular CLI: 8.0.3
Node: 10.16.1
OS: linux x64
Angular: 8.0.2
... animations, cdk, common, compiler, compiler-cli, core
... elements, forms, language-service, platform-browser

Package                             Version
-------------------------------------------------------------
@angular-devkit/architect           0.800.3
@angular-devkit/build-angular       0.800.3
@angular-devkit/build-optimizer     0.800.3
@angular-devkit/build-webpack       0.800.3
@angular-devkit/core                8.0.1
@angular-devkit/schematics          8.0.3
@angular/cli                        8.0.3
@angular/material                   8.0.1
@angular/platform-browser-dynamic   8.0.1
@angular/router                     8.0.1
@ngtools/webpack                    8.0.3
@schematics/angular                 8.0.3
@schematics/update                  0.800.3
rxjs                                6.5.2
typescript                          3.4.5
webpack                             4.30.0

Thanks for any help in advance!

Riverman
  • 503
  • 6
  • 17
  • 2
    Well you are missing those properties. Either remove the references if you don't need them, or add the properties. – Dino Aug 08 '19 at 09:05
  • How am I supposed to remove such property? Here this error: `Property 'title' does not exist on type 'DialogData'.` It does refer to this HTML fragment: `

    ` If I remove it, I obviously lose this component provided by Angular Material.     – Riverman Aug 08 '19 at 09:59

1 Answers1

2

I have come across this recently, hopefully this will help someone else as it worked for me,

Update angular.json, under production configuration

"aot": false, "vendorChunk": true, "buildOptimizer": false,

CodeCommit
  • 21
  • 4
  • It is indeed linked to the AOT compiler. I also had to switch it of as a library I use is not compliant and kept giving errors. – bas Jun 08 '20 at 13:17
  • i found this also solved an issue for us where a new property on an existing model wasn't compiling correctly. what are the side effects of making this change? – Matt M Aug 06 '20 at 15:13