I'm trying to integrate RHL @3.0.0-beta.6 to my project and I ended up stripping it to something similar to this example https://github.com/patrikholcak/hot-loader-demo
I have my babel settings in .babelrc as follows:
{
"presets": ["react", "stage-2", "es2015"],
"plugins": ["react-hot-loader/babel", "transform-runtime", "array-includes", "transform-object-assign", "transform-decorators-legacy"]
}
The app renders and there is no error. But when I try to modify something in my App component, it doesn't visually update.
What's weird is that the console actually prints the update was successful
[HMR] connected
[HMR] bundle rebuilding
[HMR] bundle rebuilt in 793ms
[HMR] Checking for updates on the server...
[HMR] Updated modules:
[HMR] - ./src/components/App.js
[HMR] App is up to date.
I ended up changing my .babelrc to be exactly the same as @patrikholcak 's example and I noticed that when I was excluding es2015 from the plugins array, the component was getting updated properly.
Anyone has a clue about this issue? Cheers!
EDIT: The simplest way to reproduce this is to clone the demo repo and add es2015 preset in package.json.
Weird, we've been having problems when not including babel-preset-es2015, see #313.
This looks like it has something to do with Webpack 2's native ES2015 modules and how Babel transpiles ES2015 modules. I added es2015/stage-2 to that repo's babel config, reproduced the issue, and fixed it by changing it to ["es2015", { "modules": false }].
Thanks @calesce. It worked. But after running my project (not the demo) the console started being bitchy about inexistent imported constants and other things. I can't say it wasn't right, but I don't know why it didn't do this before this update to my app.
Anyway, thanks for taking a look and for the fix.
Ok, just checked, and if you don't opt out of Babel transpiling ES2015, you'll need to re-require the root component like here. I'm going to add a section to the docs so that's more clear.
Added a note to readme
Most helpful comment
Added a note to readme