Webpacker HMR looking for json with content-type text/html with a 404 cause page reload

[AirWick219]

I have got hmr set up where the webpack-dev-server if returning the correct hot-update.json back and it swapped the module without page reload. but there is an extra hot-update.json with a content-type of text/html that's is not there and throw a 404 which causes the page to reload. I was wondering if you guys have an idea of what that might be ??

webpacker 3.3.1,
webpack-dev-server: 2.11.2

[gauravtiwari]

@AirWick219 What version of Rails are you using? Do you have an example repo somewhere?

[AirWick219]

I am on rails 5.1. Let me try to recreate this in my other repo.

I faught with this a little bit last night and it seems that the 6137e4 ... hash it is the same hash as the over all webpack compile hash from the console. Seems like something is going on with the webpack-dev-server.

I am not sure why its trying to look for that json in the generated boobstrap file for the other hash.

In this case, It's the 86d36.... hash

[AirWick219]

Weird ... You can close this ... While preparing a example repo .. It magically works and the extra json is not there anymore which does not cause the 404.

But in order to prevent the page refresh. I have to add the following code in my root level component to remount the latest module since I am using react-rails.

components/Base.jsx

if (module.hot) {
  module.hot.accept('./Management', () => {
    ReactRailsUJS.mountComponents();
  });
}

Otherwise, I would get an error in the dev-server

Aborted because ./app/javascript/components/Management.jsx is not accepted

Since webpacker has a issue going on to restrict using webpack-dev-server 3+
#1303 . so not sure if that's something that would go away with webpack-dev-server 3+

[gauravtiwari]

Great 👍 going to close this one for now.

[ahmadasaad89]

I have this exact problem, HMR is looking for a different hash than the one generated on recompile, any ideas why is this happening?