Long-term Caching

Long Term Caching

To effectively cache your files, they should have a hash or version in their URL. You can emit or move the output files manually in a folder called v1.3. But this has several disadvantages: Extra work for the developer and unchanged files aren’t loaded from cache.

Webpack can add hashes for the files to the filename. Loaders that emit files (worker-loader, file-loader) already do this. For the chunks you have to enable it. There are two levels:

  1. Compute a hash of all chunks and add it.
  2. Compute a hash per chunk and add it.

Option 1: One hash for the bundle

Option 1 is enabled by adding [hash] to the filename config options:

webpack ./entry output.[hash].bundle.js

{
    output: {
        path: path.join(__dirname, "asset