Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
  • 01:34
    alexseitsinger commented #1210
  • Sep 20 22:40
    alexseitsinger commented #1342
  • Sep 20 22:35
    theKashey commented #716
  • Sep 20 22:27
    Slapbox commented #716
  • Sep 20 22:09
    theKashey commented #716
  • Sep 20 22:00
    Slapbox commented #716
  • Sep 20 21:52
    nahuelarjonadev commented #1305
  • Sep 20 21:52
    nahuelarjonadev commented #1333
  • Sep 20 21:49
    nahuelarjonadev commented #1305
  • Sep 20 21:38
    theKashey commented #1333
  • Sep 20 21:36
    theKashey commented #716
  • Sep 20 21:21
    Slapbox commented #716
  • Sep 20 16:55
    RobertGary1 closed #1346
  • Sep 20 09:02
    c690554125 commented #1333
  • Sep 20 06:25
    c690554125 commented #1333
  • Sep 20 06:16
    c690554125 commented #1333
  • Sep 20 03:59
    theKashey commented #1305
  • Sep 20 03:32
    c690554125 commented #1305
  • Sep 20 00:35
    theKashey commented #1346
  • Sep 19 23:30
    RobertGary1 commented #1346
Anton Korzunov
PS: React-Hot-Loader v4.2.0 got released yesterday. Should fix any "component-did-not-update" issues.
Thanks @theKashey, will give it a whirl
@theKashey it works! you legend :)
Mbechezi Mlanawo
Hello :)
I'm trying to run react -hot-loader with webpack 4.1. Use this configuration https://gist.github.com/Shine-neko/06bba76d77e8806085616a0e6165dc59
it reload entire page :/
hello, I have the problem. My code is updated, but the page does not to update lastet.
George Cameron
So I've nearly got it working
I just have a problem where its sending a http get request not a https
for the updated json file
does anyone know how I can make this get req to https?
thats my config atm
Sibelius Seraphini
how can I check which modules are been hot reloaded?
which files?
Sibelius Seraphini
anybody got react-hot-loader working with webpack-serve?
what is the difference from webpack-dev-server?
Sibelius Seraphini
can I mark some .js file not to hot reload?
Evgeniy Podgaetskiy

Do you have problem with

constructor(props) {

After reload I have "undefined" ....

George W Langham
@sibelius yeah you can, you set it as ignore in the config
I forget the exact code for it though, but it's officially supported for both files and folders
@epodgaetskiy it's not recommended to do a log in the constructor, as you can't guarantee the props are rendered yet. Better to do it in ComponentDidMount
Daniel Forslund

Hi! We're having issues with getting RHL (v4) and react-router (v4) to play nicely together. For storing the router state, we've tried both react-router-redux (v5) and connected-react-router (v4). We're using the "hot"-HOC, wrapped with the Provider- and ConnectedRouter-components "above".

Hot-reloading works great, until a route change is made, eg. by simply clicking on a link. At that point, the view gets somewhat messed up and the following error message is logged:
React-hot-loader: fatal error caused by ƒ ExportedComponent() { classCallCheck(this, ExportedComponent); return possibleConstructorReturn(this, _Component.apply(this, arguments)); } - no instrumentation found. Please require react-hot-loader before React. More in troubleshooting.

I haven't been able to find someone with a similiar problem. I can't see where react-hot-loader isn't being imported correctly, as it work's before route-changes, but am I perhaps missing something in relation to react-router? Or could it have something to do with redux? I'd appreciate any help!


Arkadiusz Czekajski
Hello! I have a problem with hot reloading while transpiling whole node_modules to ES5. I have the infamous Objects are not valid as a React child error. I've read many discussions on GitHub but the supposed-to-be-solution, which advises to have an entry specified as '@babel/polyfill', 'react-hot-loader/patch', 'react', 'react-dom', ...does not help. When serving my app through webpack-dev-server, the entry point has an additional __webpack_require__("./node_modules/webpack-dev-server/client/index.js?http://localhost:8080"); before polyfills. This import of webpack-dev-server/client seems to somehow invoke a react-hot-loader which in turn, imports react, so react import happens before polyfills. Do you have any idea what I might be doing wrong? My idea is that node_modules shouldn't be transformed with react-hot-loader/babel plugin, but unfortunately the plugin has no config to exclude paths.
Arkadiusz Czekajski
I ended up removing react-hot-loader/babel from loader which transforms my whole project together with node_modules and I've created a separate loader with enforce: 'post' which applies only the RHL plugin and has node_modules excluded. webpack-dev-server/client/index.js?http://localhost:8080 is still loaded before polyfills but it doesn't invoke RHL now.
I have a question. I did not setup our react hot loader, but when trying to load subroutes directly (navigating to them from a page works), we always get an error. Not sure if it is the react hot loader or some other setting (we are using neutrino start to run everything). So if I try something like http://localhost:4200/experiment/create I get GET http://localhost:4200/experiment/index.js net::ERR_ABORTED 404 (Not Found) create:1 Refused to execute script from 'http://localhost:4200/experiment/index.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled. Is this some setting I am missing or perhaps in the way that the index.js file is built?
Hello, what is react-hot-loader/patch, who can help me ?
Nick Perna
Hey, just wanted to put this out there. I’m in the Chicago area- we are always looking for React developers. If you are looking for work or want to make a career change- email me at nperna@teksystems.com
Karel Janík
Hi guys, can somebody give me advice about refreshing app when i editing code? my problem is, if i save small change in any component, my all app is refreshing and i must clicking all again to my nested part of developing... thanks you..
Morgan Moskalyk
Curious, what's the difference between this and React.Lazy imports? Also, is there a way to download React Components (or Webpack Builds) with HTTP, then import them into the module in real time with react-hot-loader?
can react hot loader keep the current redux state (on webpack dev server) when you run a hard refresh?
Zack Jackson
Depends on how states are stored. Hot usually wraps the connect function which can flush state, though I’ve not had many issues before.
Prakash Borkar

Hi guys I am having trouble using react-hot-loader. Hot loading works but it is kind of doing full reload even if leaf node changed. Here's my code


  1. Start webpack-dev-server with hot:true

  2. Patch top level entry with hot


    import { hot } from 'react-hot-loader/root';
    import App from './containers/App';
    export default hot(App);

app.js --Main entry

    import 'babel-polyfill';

    import React from 'react';
    import ReactDOM from 'react-dom';
    import { Provider } from 'react-redux';
    import { Route } from 'react-router';
    import { BrowserRouter } from 'react-router-dom';

    // Import root app
    import App from './app1';

    import configureStore from './store';

    const render = () => {
        <Provider store={configureStore()}>
            <Route component={App} />
        , document.getElementById('app')

Prakash Borkar
anyone who can help me here?
@theKashey ?
Tony Jin
Did you apply on babel? or webpack.
Hello everyone, I've updated react-hot-loader from v3.1.3 to v4.6.5. Everything was working fine before but now I have a strange case where in many instances, the updates are not applied immediately. Instead the changes are applied like this:
changeCode1 --> No visible update
changeCode2 --> Component/DOM updated with changeCode1
changeCode3 --> Component/DOM updated with changeCode2
In rare occasions, it does seem to be able to apply the changes as expected. But in most cases there is this strange "delay".
Any idea? help greatly appreciated : )
Anton Korzunov
@AoDev - some components dont want to be redrawn. Known issue, which "was fixed". Please create an issue.
@zeoneo - should work. Create an issue with a bigger example please.
Daniel Netzer
let's give it a shot
is there a way to exclude certain modules from react-hot-loader?
i'm using docz that use react-hot-loader under the hood, and when I try to plugin another module the entire thing fail
at this line of code
(function () {
  var enterModule = (typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal : require('react-hot-loader')).enterModule;
  enterModule && enterModule(module);
with the following error:
ReferenceError: module is not defined
Ryan J. Peterson
Okay, so I am getting a strange error when setting things up that I can't seem to figure out WHY it's happening.
react-hot-loader.production.min.js:1 React-Hot-Loader: misconfiguration detected, using production version in non-production environment.
I am setting NODE_ENV and have it wired up using .babelrc as described in latest docs.
Bram Van der Sype
Is there still documentation somewhere from pre 4.6 when the syntax changed? I've inherited an older project that still uses react-hot-loader with v4.0. The syntax they're using is export default hot(module)(withRouter(App));, but when building production, I get an error that e is not a function (I'm guessing it's because the code isn't checking if hot reloading is actually needed. (disclaimer: I'm very new to frontend development/react/webpack so this issue is probably PEBKAC related).
AAAAAND I've just noticed this channel is pretty dead :joy: