deployed react web app requires hard refresh

Question

Bootstrapped with create-react-app (v1.0.13). Whenever I update the source & redeploy users need to hard refresh to get the new content. I've included non-cache header in index.html:

<meta http-equiv="Cache-Control" content="no-store" />

& turned off provided service workers. Also change the .js filename (and reference in index.html) in build folder before deploying.

Answer 1

For anyone coming in the future -- all you need is the

{unregister} from ./registerServiceWorker

unregister();

This helped my create-react-app work with hosts like gh-pages and netlify.

Answer 2

I was able to remove caching by doing the following:

• adding the following to in index.html <meta http-equiv="Pragma" content="no-cache" /> <meta http-equiv="Expires" content="0" />
• inserting the following to the js import { unregister } from './registerServiceWorker'; unregister()
• changing cloudflare caching expiration to 'respect existing headers' at https://www.cloudflare.com/a/caching/

It is unclear which of these (or all of these) are actually required but it's a start.