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.
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.