Discussion on: 📦 webpack secrets

[JD Gonzales]

This is very edge-case & specific but I spent days on this problem.

If you compile your assets on multiple servers and use @svgr/webpack, sometimes it can build 2 different hashes for a single compiled js asset, based on some attributes (or empty attributes) in svg elements, which causes inconsistent bundle names across multiple servers who all run the build step on their own. This causes unfortunate bundle app-[hash].js not found errors on the client side.

The trick to solving this is to disable svgo

test: /\.(svg)$/,
use: [
  {
    loader: '@svgr/webpack',
    options: {
      svgo: false
    }
  }
]