How to set up caching for SPA on React?

Question

JavaScript

Good afternoon.

I am writing an application in React, building it with Webpack. I use code splitting, the files in the bundle are called 1.bundle.js, 2.bundle.js... Preparing it for publication. For now, I just uploaded the contents of the dist folder to the hosting. Everything worked until I decided to update the code, rebuild the bundle and upload it to the hosting. After the described actions, part of the application stopped working. Cleared the browser cache - everything worked as it should. It seems that the problem is that the browser has cached some of the js files that the application accesses. These files are updated, but the browser still takes them from the cache.

As far as I remember, html can completely disable caching, but this is not entirely correct. How do you solve this problem?

Answer 1

Hashes as correctly said, well, or the name of the bundle is a question and ?v=42