ng build --prod does NOT minify / uglify / remove

Question

Since I've upgraded my Angular app to use Angular CLI version 6.x, compiling it for production (using ng build --prod, as usual) does not produce minified js. This result in very big vendor.js size (in my case is almost 10 MB).

If I open the resulting vendor.js file, I can clearly see that the code is not minified and the comments are not removed.

Answer 1

The issue is in angular.json file.

Under the key projects.MY_PROJECT_NAME.architect.build.configurations.production, I was missing all the options that normally comes by default in the production configuration when you create a new angular project.

This is how the production configuration should look like in order to fix the issue:

"production": {
  "fileReplacements": [
    {
      "replace": "src/environments/environment.ts",
      "with": "src/environments/environment.prod.ts"
    }
  ],
  "optimization": true,
  "outputHashing": "all",
  "sourceMap": false,
  "extractCss": true,
  "namedChunks": false,
  "aot": true,
  "extractLicenses": true,
  "vendorChunk": false,
  "buildOptimizer": true
},

For some reasons, after upgrading from previous Angular CLI versions, my production configuration only had the fileReplacements key. Adding the other properties shown above (optimization, outputHashing, etc...) solved the issue for me.