CODEWITHSUNDEEP
angulartypescriptuglifyjs
rdethurens
rdethurens

Reputation: 283

Avoid Mangle Class Name in Angular 8

I have a Single Page Application in Angular 8. In this application, I use in typescript class the constructor name to perform some Operations. All is working fine in developpement.

class User {
  GetClassName() {
     return this.constructor.name;
  } 
  // returns "User"
}

However when I build in production mode :

npm run ng build -- --configuration=prod

Angular perform a lot of optimization including Uglify Class Name

class User {
  GetClassName() {
     return this.constructor.name;
  }
  // returns "t"
}

So my constructor name is Now t and not user. How to configure Angular Build to avoid Uglify some class name or all class name ?

It seems that's when can replace mangle option but i wouldn't do that in my nodemodule but prefer use a custom config file given on build.

Did someone succesfully do that ?

Thanks for all

Upvotes: 2

Views: 2329

Answers (2)

Tal
Tal

Reputation: 111

from: Angular-cli : How to ignore class names from being minified

Angular cli builder supports NG_BUILD_MANGLE, NG_BUILD_MINIFY, NG_BUILD_BEAUTIFY node environment params (checked in version 8).

You can set them when running npm script in following way: env NG_BUILD_MANGLE=false NG_BUILD_MINIFY=false NG_BUILD_BEAUTIFY=true ng build --prod

This will result in unminified output, yet tree shaking and other optimizations will still be applied (compared to just turning off optimization).

Upvotes: 4

beanic
beanic

Reputation: 562

@rdethurens could you add any example about what you are looking for? I think you could add a custom class in the html tag you want change adding ngClass.

For example:

<div [ngClass]="myClass">...</div>

Upvotes: -1

Related Questions