Search code examples
angularbuildangular-cliproduction

Angular ng build --target=production giving errors


I have a created a new Angular Project using Angular-CLI.

The versions I am using are:

Angular-Cli: 1.0.2

Angular: 4.0.0.

I have added a lot of code in it but now, when I build my project using below command I get bunch of errors

ng build --target=production --env=staging

Errors:

/src/app/views/signup/signup.component.html (21,86): Property 'email' is protected and only accessible within class 'SignUpComponent' and its subclasses.

/src/app/views/signup/signup.component.html (26,80): Property 'password' is protected and only accessible within class 'SignUpComponent' and its subclasses.

Can someone please help me in this regard that how can I remove these errors? The build is successful when I omit --target=production BUT in past I got issue that without specifying target browser cache the old deployment version and user has to delete the browser cache to effect latest changes/deployment.


Solution

  • Are your email and password properties defined to be private? Are they used in the component's template? Then they need to be changed from private to public.

    When you use the Angular CLI's production mode, you automatically get the following:

    • --aot is set to true
    • --output-hashing is set to all (fingerprints assets)
    • --sourcemaps is set to false
    • --extract-css is set to true (makes real css files for global styles, while dev makes .js files as a rebuild optimization)
    • adds service worker if configured in the CLI json
    • replaces process.env.NODE_ENV in modules with the production value (this is needed for some libs, like react)
    • runs uglify on the code

    See this for more information: https://github.com/angular/angular-cli/pull/6232

    It is the aot compiler that is most likely generating these errors. The aot compiler compiles the template in TypeScript and hence generates more type errors. So another alternative is to use the --prod without aot.