Multiple Loading of theme.css and preloading.css Files When Deploying Live with primeng Apollo Theme

Question

I am facing a problem with my website deployment using the primeng Apollo theme. When I run the site locally, the theme.css file and preloading.css file are loaded only once, and everything works smoothly. However, when I deploy the site live, both theme.css and preloading.css files are being loaded multiple times. This is not the behavior I expected.

Can anyone assist me in resolving this issue? I need help to ensure that the theme.css and preloading.css files are loaded correctly when deploying the site live. Thank you in advance for any guidance or suggestions you can provide.

I expected the same behavior during live deployment as when running the site locally, where the theme.css and preloading.css files would load only once.

Answer 1

If you use no-cache for all files this happens, which was the case in our project.

I used this deploy-an-angular-app-with-nginx

you should only cache css and js files, index.html must not be cached.

location ~ /index.html|.*\.json$ {
      expires -1;
      add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
}

location ~ .*\.css$|.*\.js$ {
      add_header Cache-Control 'max-age=31449600'; # one year
}

location / {
      try_files $uri$args $uri$args/ /index.html;
      add_header Cache-Control 'max-age=86400'; # one day
}