Securing an Angular 6 / 7 app by hiding/obfuscating the code

Question

Is there a way to obfuscate the production code of anAngular 6 (or 7) application. By production code i mean the dist folder generated after the command ng build --prod. I have seen a software named Jscrambler but it is not free. How can i do that ?

thanks

Answer 1

If you have Angular 7+, you can make use @angular-builders/custom-webpack to utilize javascript-obfuscator. Note that I linked the custom-webpack for Angular 8+, assuming that you may have upgraded since a year ago. If you need an Angular 7 version, they have a link on that page to the Angular 7 compatible version of @angular-builders/custom-webpack

Answer 2

When you use Angular CLI to build production code, your code is already minified and uglified (by UglifyJS) as said in the Angular doc

The --prod meta-flag engages the following build optimization features.

 - Ahead-of-Time (AOT) Compilation: pre-compiles Angular component templates.
 - Production mode: deploys the production environment which enables production mode.
 - Bundling: concatenates your many application and library files into a few bundles.
 - Minification: removes excess whitespace, comments, and optional tokens.
 - Uglification: rewrites code to use short, cryptic variable and function names.
 - Dead code elimination: removes unreferenced modules and much unused code.

If you didn't get code objuscation, you may need to check your angular.json file and make sure it contains the following settings:

"configurations": {
  "production": {
    "optimization": true,