iansinnott / react-static-boilerplate

A boilerplate for building static sites with Webpack 2, React and React Router
107 stars 16 forks source link

Is there a way to enable hot module replacement #2

Closed iEricKoh closed 8 years ago

iEricKoh commented 8 years ago

@iansinnott I'm familiar with the webpack-dev-server and have used it quite a bit. But in webpack-dev-middleware, I have no idea on how to get hot module replacement working in this project.

Currently there is a error message from HMR on chrome console after I save my changes in the file.

[HMR] The following modules couldn't be hot updated: (Full reload needed) This is usually because the modules which have changed (and their parents) do not know how to hot reload themselves. See http://webpack.github.io/docs/hot-module-replacement-with-webpack.html for more details.

Could you please give me some advice on hot-module-replacement with webpack-dev-middleware? thanks.

Also, are you going to upgrade version of babel from 5.. to 6..?

iansinnott commented 8 years ago

Hm, that's odd. HMR works for me when I'm running this project (i.e. npm start). Can you point me to a repo where I can reproduce the issue?

Something to note is that HMR doesn't usually work with the root component. I haven't found explicit documentation on this yet but in my experience changes to a root component require a full reload.

Another issue may be functional components. According to the repo we're using functional components are not yet supported for HMR, only React.createClass or class Blah extends React.Component type components are supported. See this issue for details.

iEricKoh commented 8 years ago

@iansinnott Thanks for your updated.

I've try and test again, it's a functional components problem. Thanks.

iansinnott commented 8 years ago

:+1:

gaearon commented 8 years ago

React Hot Loader 3 supports functional components without destroying the state. It supersedes both React Hot Loader and React Transform, and is built on lessons learned from both. Check it out: https://github.com/gaearon/react-hot-boilerplate/pull/61