Issues when combining webpack HMR and react-refresh-webpack-plugin about react-refresh-webpack-plugin HOT 10 OPEN

What is RRWP? Did you mean this plugin? Nevermind, thinking about your problem now.

from react-refresh-webpack-plugin.

Yes, someone on IRC referenced it like that and I was under the impression that it was a common abbreviation.

from react-refresh-webpack-plugin.

I will need to see your webpack.config.js, just provide me the part you setup for devServer. The setup itself is tricky.

from react-refresh-webpack-plugin.

{
  devtool: "eval-source-map",
  mode: "development",
  devServer: {
    hot: true,
    liveReload: false,
    allowedHosts: [ "all" ],
    devMiddleware: { writeToDisk: true, index: false },
    proxy: [{
      context: [
        "**",
        "!/client/our-client.js"
      ],
      target: "http://localhost:8000",
      proxyTimeout: 1000 * 60 * 30,
      timeout: 1000 * 60 * 30
    }],
    compress: false,
    port: 9000
  }
}

And we run webpack like so: webpack serve --config=webpack.development.config.js

from react-refresh-webpack-plugin.

@JKHSDTV Does your <ClientContent /> directly contain those many Foo.jsx component wrapped by a FooContainer.js container? If so try adding one more layer like this:

<App/> -> <ClientContent/> -> many `Foo.jsx`

Also, make sure that you don't use any anonymous function for default export.

reference: https://github.com/pmmmwh/react-refresh-webpack-plugin/blob/main/docs/TROUBLESHOOTING.md#troubleshooting

from react-refresh-webpack-plugin.

Got multiple levels like that between Foo and ClientContent, and no anonymous default exports. Went through all the troubleshooting, none seem to apply.

from react-refresh-webpack-plugin.

I've got another clue, I think: when I limited my module.hot.accept to accept a specific file, like module.hot.accept('./stuff/WhatEverStuff.js'), I got the error message Error: Aborted because ./src/stuff/WhatEverStuff.js is not accepted. However, if I change the accept to include the src part of the path, it (correctly, since main.js is in src) complains that it can't resolve ./src/stuff/WhatEverStuff.js. I am not certain what could be introducing this mismatch.

from react-refresh-webpack-plugin.

Are you doing any manual module.hot.accept?

from react-refresh-webpack-plugin.

It would be helpful if a reproduction can be provided

from react-refresh-webpack-plugin.

Are you doing any manual module.hot.accept?

Your responded to a comment from me about how I use module.hot.accept 😂

I'm afraid it's the typical situation of where it's part of a complex proprietary setup that isn't easy to export as a test case :(

from react-refresh-webpack-plugin.