Update TodoMVC example to React Hot Loader 3

gaearon · gaearon · commit 64f58b7010a1 · 2016-04-18T13:28:26.000+01:00
diff --git a/examples/todomvc/.babelrc b/examples/todomvc/.babelrc
@@ -1,3 +1,4 @@
 {
-  "presets": ["es2015-loose", "stage-0", "react"]
+  "presets": ["es2015-loose", "stage-0", "react"],
+  "plugins": ["react-hot-loader/babel"]
 }
diff --git a/examples/todomvc/index.js b/examples/todomvc/index.js
@@ -1,12 +1,28 @@
 import 'todomvc-app-css/index.css';
 import React from 'react';
 import { render } from 'react-dom';
+import { AppContainer } from 'react-hot-loader';
 import configureStore from './store/configureStore';
 import Root from './containers/Root';
 
 const store = configureStore();
 
 render(
-  <Root store={store} />,
+  <AppContainer
+    component={Root}
+    props={{ store }}
+  />,
   document.getElementById('root')
 );
+
+if (module.hot) {
+  module.hot.accept('./containers/Root', () => {
+    render(
+      <AppContainer
+        component={require('./containers/Root').default}
+        props={{ store }}
+      />,
+      document.getElementById('root')
+    );
+  });
+}
diff --git a/examples/todomvc/package.json b/examples/todomvc/package.json
@@ -29,8 +29,8 @@
   "homepage": "https://github.com/gaearon/redux-devtools#readme",
   "dependencies": {
     "classnames": "^2.1.2",
-    "react": "^0.14.6",
-    "react-dom": "^0.14.6",
+    "react": "^15.0.1",
+    "react-dom": "^15.0.1",
     "react-redux": "^4.1.0",
     "redux": "^3.1.1"
   },
@@ -43,10 +43,10 @@
     "babel-preset-stage-0": "^6.3.13",
     "node-libs-browser": "^0.5.2",
     "raw-loader": "^0.5.1",
-    "react-hot-loader": "^1.3.0",
+    "react-hot-loader": "^3.0.0-alpha.8",
     "redux-devtools": "^3.0.1",
-    "redux-devtools-log-monitor": "^1.0.2",
     "redux-devtools-dock-monitor": "^1.0.1",
+    "redux-devtools-log-monitor": "^1.0.2",
     "style-loader": "^0.12.3",
     "todomvc-app-css": "^2.0.1",
     "webpack": "^1.9.11",
diff --git a/examples/todomvc/webpack.config.js b/examples/todomvc/webpack.config.js
@@ -6,6 +6,7 @@ module.exports = {
   entry: [
     'webpack-dev-server/client?https://localhost:3000',
     'webpack/hot/only-dev-server',
+    'react-hot-loader/patch',
     './index'
   ],
   output: {
@@ -30,12 +31,12 @@ module.exports = {
   module: {
     loaders: [{
       test: /\.js$/,
-      loaders: ['react-hot', 'babel'],
+      loaders: ['babel'],
       exclude: /node_modules/,
       include: __dirname
     }, {
       test: /\.js$/,
-      loaders: ['react-hot', 'babel'],
+      loaders: ['babel'],
       include: path.join(__dirname, '..', '..', 'src')
     }, {
       test: /\.css?$/,

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,4 @@`
`1`	`1`	`{`
`2`		`- "presets": ["es2015-loose", "stage-0", "react"]`
	`2`	`+ "presets": ["es2015-loose", "stage-0", "react"],`
	`3`	`+ "plugins": ["react-hot-loader/babel"]`
`3`	`4`	`}`