CODEWITHSUNDEEP
angular
Omar
Omar

Reputation: 3050

Angular 5 "ng build" shows no errors "ng build --prod" has many errors

I know this has been asked before but nothing I read is helping.

after ng build there are no errors

after 'ng build --prod'

ERROR in src/app/catalog/product/product.component.html(19,43): : Property 'length' does not exist on type 'object'.
src/app/catalog/product/product.component.html(36,39): : Property 'specs' does not exist on type 'Object'.
src/app/catalog/product/product.component.html(58,8): : Property 'config' does not exist on type 'ProductComponent'. Did you mean 'Configs'?
src/app/catalog/product/product.component.html(59,14): : Property 'config' does not exist on type 'ProductComponent'. Did you mean 'Configs'?
src/app/catalog/product/add/add.component.html(14,8): : Property 'pre_configs' does not exist on type 'object'.
src/app/catalog/product/add/add.component.html(30,28): : Property 'sets' does not exist on type 'object'.
src/app/catalog/product/add/add.component.html(70,32): : Property 'price' does not exist on type 'object'.
src/app/catalog/product/add/add.component.html(70,32): : Property 'price' does not exist on type 'object'.
src/app/navigation/mini/mini-search/mini-search.component.html(9,5): : Property 'searchText' does not exist on type 'MiniSearchComponent'.
src/app/navigation/mini/mini-search/mini-search.component.html(13,5): : Property 'searchText' does not exist on type 'MiniSearchComponent'.
src/app/catalog/single/single.component.html(5,24): : Property 'id' does not exist on type 'any[]'.
src/app/catalog/single/single.component.html(74,25): : Property 'id' does not exist on type 'any[]'.
src/app/navigation/maga/maga.component.html(5,8): : Property 'name' does not exist on type 'any[]'.

This is an extremely annoying problem. I started to look at the errors one by one and will continue to but the errors just done make sense and that route will take me several hours. Can anyone advise me on where to start or why there are new errors after --prod?

Update: example of one of the errors

in my components html

<div *ngIf="sample?.specs">
    <div class="spec-section" *ngFor="let section of sample.specs">
        <h2>{{section.name}}</h2>
    </div>
</div>

error after ng build --prod

ERROR in ../product/product.component.html(37,12): : Property 'specs' does not exist on type 'Object'.

The following is the component code for getting sample

constructor(public configsService: ConfigsService) {
    this.sample = configsService.sample_data;
}

after ng serve or deploying ng build the fronend looks/ works fine. The error just pops up durring ng build --prod

Upvotes: 4

Views: 2350

Answers (1)

Omar
Omar

Reputation: 3050

Each error had its own fix mostly related to how I was getting data from my service.

Example 1 of a fix

constructor(public configsService: ConfigsService) {
    this.sample = configsService.sample_data;
}

Should be..

get sample() { return this.configsService.Sample_data; }
constructor(public configsService: ConfigsService) {}

For this to work I had to put a get in the service

import { Sample } from '../_data/sample_product';

@Injectable()
export class ConfigsService {
    sample_data = Sample;
    constructor()  {}
    get Sample_data() { return this.sample_data; }
}

Example 2 of a fix

html

<a (click)="config=!config" class="button">Configure</a>

that worked in ng serve and ng build but not in ng build --prod because I did not declare config in the component. Like this config:boolean;

(answer.helped) ? upvote() : comment();

Upvotes: 1

Related Questions