react-hot-loader

This is a highly experimental proof of concept of React live code editing.
It marries React with Webpack Hot Module Replacement by monkeypatching React.createClass.

Inspired by react-proxy-loader.

Running Example

npm install
cd example
webpack-dev-server --hot
open http://localhost:8080/webpack-dev-server/bundle

Then edit example/a.jsx and example/b.jsx.
Your changes should be displayed live, without unmounting components or destroying their state.

Limitations

• You have to include component's displayName in require call

Implementation Notes

Currently, it keeps a list of mounted instances and updates their prototypes when an update comes in.
A better approach may be to make monkeypatch createClass to return a proxy object as suggested by Pete Hunt:

Installation

npm install react-hot-loader

Usage

Documentation: Using loaders

// Currently you have to pass displayName to require call:
var Button = require('react-hot?Button!./button');

When a component is imported that way, changes to its code should be applied without unmounting it or losing its state.

License

MIT (http://www.opensource.org/licenses/mit-license.php)