With .Net Core React/Redux template, disabling webpack HMR causes “__webpack_hmr” resource to keep being requested

Question

I'm in the process of building a React/Redux app on .Net Core 2.0, so I've used the template provided. I've been running into this issue when I disable the webpack HMR through my Startup.cs, basically just commenting out the following lines:

            app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions
            {

                HotModuleReplacement = true,
                ReactHotModuleReplacement = true,
                HotModuleReplacementClientOptions = new Dictionary<string, string>
                {
                    { "quiet", "true" }
                }
            });

However, when I do this, there is a get request coming from the client for this __webpack_hmr. Here is the output in VS:

Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request starting HTTP/1.1 GET http://localhost:34521/dist/__webpack_hmr  

I'm trying to disable HMR for now because it's causing my app to start up slowly (different topic), but I have to keep it on because if not it'll keep pinging for this resource. I'm also worried about how this will act in production. Has anyone else run in to this? Any solution for it?

Answer 1

The problem I figured out was a user error. When I disabled webpack HMR in Startup.cs, I need to also rebuild the main client bundle. Essentially I was just commenting out those lines and restarting the app, but webpack wasn't rebuilding so I had an old client bundle that was expecting the "__webpack_hmr" resource to be there.

Answer 2

Simply remove wwwroot/dist and ClientApp/dist folders, and run:

node node_modules/webpack/bin/webpack.js --config webpack.config.vendor.js

This will rebuild the vendor dependencies, and allow your code to be rebuilt.