CODEWITHSUNDEEP
angularcachingangular-clibrowser-cacheangular-cache
Nikunj Beladiya
Nikunj Beladiya

Reputation: 159

Cache busting is not working sometimes after production build in angular 7

Our app uses the node.js Core & Angular version 7.2

We are frequently rollout production build of the Angular app to deploy the changes 3-4 times in a month.

I have received some client's complaints who are unable to see changes unless they clear their cache or hard reload the page in the browser.

I thought ng build --prod created unique hashes so it would handle cache-busting, But it doesn't seem to be happening.

In angular.json I have below configuration for the production build

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

After running ng build --prod it is generating hashed files and it's different from previous version based on changes. Also, I have configured the server to do not cache index.html. then why sometimes users need to hard reload the page or clear the cache manually to get the latest changes?

Is there any way I can combat this issue besides telling clients to clear their cache?

Any suggestions would be greatly appreciated.

Upvotes: 6

Views: 5754

Answers (1)

Bhaskar Reddy
Bhaskar Reddy

Reputation: 79

angular old version:

ng build --prod --aot --output-hashing=all

For the newer version of angular ( for example Angular 10) the command is now updated:

ng build --prod --aot --outputHashing=all

Upvotes: 0

Related Questions