My app is using React and Webpack of Laravel-mix to dynamically load components for each route. And this is my webpack output config:
output: {
chunkFilename: '[name].js?id=[chunkhash]'
}
This means that a component's chunkhash only changes when its content changes. Combined with the settings of the CDN server is to cache files by id param.
It seems to work perfectly every time there are changes to individual components without affecting other components. But recently my client had an error Loading chunk failed, and in the error log I noticed, the chunkhash of the file that the client got the error was the same as the chunkhash of the file on the server, i.e. there was no change in the content nor the chunkhash of the file. But even if the chunkhash is changed, the client requests to the old chunkhash, the CDN server will also return the latest file because of its param cache mechanism.
This error happens often recently and it seems to go away after the client reloads the page, I can't find the cause yet.
Any comments and suggestions will be appreciated.
