Fix examples HMR

example/components/index.js → example/components/app.js

@@ -1,6 +1,5 @@
 import Leaflet from 'leaflet'
 import React from 'react'
-import { render } from 'react-dom'
 
 import SimpleExample from './simple'
 import EventsExample from './events'
@@ -21,7 +20,7 @@ import VideoOverlayExample from './video-overlay'
 Leaflet.Icon.Default.imagePath =
   '//cdnjs.cloudflare.com/ajax/libs/leaflet/1.1.0/images/'
 
-const examples = (
+const App = () =>
   <div>
     <h1>React-Leaflet examples</h1>
     <h2>Popup with Marker</h2>
@@ -59,6 +58,5 @@ const examples = (
     <h2>Video overlay</h2>
     <VideoOverlayExample />
   </div>
-)
 
-render(examples, document.getElementById('app'))
+export default App

example/index.js

@@ -0,0 +1,21 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+const MOUNT_NODE = document.getElementById('app')
+
+const render = () => {
+  const App = require('./components/app').default
+
+  ReactDOM.render(<App />, MOUNT_NODE)
+}
+
+render()
+
+if (module.hot) {
+  module.hot.accept(['./components/app'], () =>
+    setImmediate(() => {
+      ReactDOM.unmountComponentAtNode(MOUNT_NODE)
+      render()
+    }),
+  )
+}

example/webpack.config.babel.js

@@ -4,30 +4,14 @@ import webpack from 'webpack'
 export default {
   devtool: 'source-map',
   entry: {
-    app: path.join(__dirname, 'components/index.js'),
+    app: path.join(__dirname, 'index.js'),
   },
   module: {
     rules: [
       {
         test: /\.js$/,
         exclude: /node_modules/,
         loader: 'babel-loader',
-        options: {
-          plugins: [
-            [
-              'react-transform',
-              {
-                transforms: [
-                  {
-                    transform: 'react-transform-hmr',
-                    imports: ['react'],
-                    locals: ['module'],
-                  },
-                ],
-              },
-            ],
-          ],
-        },
       },
     ],
   },

package.json

@@ -45,7 +45,6 @@
     "babel-plugin-dev-expression": "^0.2.1",
     "babel-plugin-external-helpers": "^6.22.0",
     "babel-plugin-lodash": "^3.2.11",
-    "babel-plugin-react-transform": "^2.0.2",
     "babel-plugin-transform-proto-to-assign": "^6.22.0",
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-react": "^6.24.1",
@@ -66,7 +65,6 @@
     "prop-types": "^15.5.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
-    "react-transform-hmr": "^1.0.4",
     "rimraf": "^2.6.1",
     "rollup": "^0.47.5",
     "rollup-plugin-babel": "^3.0.2",

yarn.lock

@@ -501,12 +501,6 @@ babel-plugin-lodash@^3.2.11:
     glob "^7.1.1"
     lodash "^4.17.2"
 
-babel-plugin-react-transform@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/babel-plugin-react-transform/-/babel-plugin-react-transform-2.0.2.tgz#515bbfa996893981142d90b1f9b1635de2995109"
-  dependencies:
-    lodash "^4.6.1"
-
 babel-plugin-syntax-async-functions@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
@@ -2310,7 +2304,7 @@ glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.1.1, glob@^7.1.2:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-global@^4.3.0, global@^4.3.2:
+global@^4.3.2:
   version "4.3.2"
   resolved "https://registry.yarnpkg.com/global/-/global-4.3.2.tgz#e76989268a6c74c38908b1305b10fc0e394e9d0f"
   dependencies:
@@ -3216,7 +3210,7 @@ lodash.cond@^4.3.0:
   version "4.5.2"
   resolved "https://registry.yarnpkg.com/lodash.cond/-/lodash.cond-4.5.2.tgz#f471a1da486be60f6ab955d17115523dd1d255d5"
 
-lodash@^4.0.0, lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.2, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.3.0, lodash@^4.6.1:
+lodash@^4.0.0, lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.2, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.3.0:
   version "4.17.4"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"
 
@@ -3954,10 +3948,6 @@ rc@^1.1.7:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
-react-deep-force-update@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.1.0.tgz#8d131ae07ae02f08df60744eb2cf2de4fcb325f1"
-
 react-dom@^15.6.1:
   version "15.6.1"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.6.1.tgz#2cb0ed4191038e53c209eb3a79a23e2a4cf99470"
@@ -3967,20 +3957,6 @@ react-dom@^15.6.1:
     object-assign "^4.1.0"
     prop-types "^15.5.10"
 
-react-proxy@^1.1.7:
-  version "1.1.8"
-  resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a"
-  dependencies:
-    lodash "^4.6.1"
-    react-deep-force-update "^1.0.0"
-
-react-transform-hmr@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/react-transform-hmr/-/react-transform-hmr-1.0.4.tgz#e1a40bd0aaefc72e8dfd7a7cda09af85066397bb"
-  dependencies:
-    global "^4.3.0"
-    react-proxy "^1.1.7"
-
 react@^15.6.1:
   version "15.6.1"
   resolved "https://registry.yarnpkg.com/react/-/react-15.6.1.tgz#baa8434ec6780bde997cdc380b79cd33b96393df"