From 7d76c590c299c4de6784dd88d309e4f105434c5c Mon Sep 17 00:00:00 2001 From: Suraj Chandola Date: Wed, 21 Nov 2018 01:08:22 +0530 Subject: [PATCH 1/4] Migrate react-hot-loader from v3 to v4 --- app/containers/App/index.js | 4 ++-- app/index.js | 10 +--------- package.json | 4 ++-- webpack.config.base.js | 3 +-- webpack.config.dev.js | 3 --- 5 files changed, 6 insertions(+), 18 deletions(-) diff --git a/app/containers/App/index.js b/app/containers/App/index.js index 8f6c309..e1a4a52 100644 --- a/app/containers/App/index.js +++ b/app/containers/App/index.js @@ -1,7 +1,7 @@ // @flow import * as React from 'react'; import { Switch, Route, Redirect } from 'react-router-dom'; - +import { hot } from 'react-hot-loader'; import ErrorBoundary from 'components/ErrorBoundary'; import Header from 'components/Header'; import Budget from 'routes/Budget'; @@ -24,4 +24,4 @@ const App = () => ( ); -export default App; +export default hot(module)(App); diff --git a/app/index.js b/app/index.js index e2e641d..27bf767 100644 --- a/app/index.js +++ b/app/index.js @@ -3,7 +3,6 @@ import { Provider } from 'react-redux'; import ReactDOM from 'react-dom'; import * as React from 'react'; import { BrowserRouter as Router } from 'react-router-dom'; -import { AppContainer } from 'react-hot-loader'; import App from 'containers/App'; import store from 'store'; @@ -16,9 +15,7 @@ const renderApp = (Component: React.ComponentType) => { - - - + , @@ -27,8 +24,3 @@ const renderApp = (Component: React.ComponentType) => { }; renderApp(App); - -// Hot Module Replacement API -if (module && module.hot && module.hot.accept) { - module.hot.accept('containers/App', () => renderApp(App)); -} diff --git a/package.json b/package.json index 2a250fd..dcc547a 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "test": "jest", "test:watch": "jest --watch", "coverage": "jest --coverage", - "start": "webpack-dev-server --config webpack.config.dev.js", + "start": "webpack-dev-server --config webpack.config.dev.js --hot", "prod": "cross-env NODE_ENV=production webpack-dev-server --config webpack.config.prod.js", "build": "rimraf build && cross-env NODE_ENV=production webpack --config webpack.config.prod.js", "perf": "rimraf *.report.dom.html && npm run build && (npm run serve & lighthouse http://localhost:3000 --view)", @@ -104,7 +104,7 @@ "prop-types": "15.6.2", "react": "16.6.1", "react-dom": "16.6.1", - "react-hot-loader": "^3.0.0-beta.7", + "react-hot-loader": "4.3.12", "react-redux": "5.0.7", "react-router": "4.3.1", "react-router-dom": "4.3.1", diff --git a/webpack.config.base.js b/webpack.config.base.js index 0b08d69..8055953 100644 --- a/webpack.config.base.js +++ b/webpack.config.base.js @@ -82,8 +82,7 @@ module.exports = config => ({ watchOptions: { ignored: ['node_modules', '*.svg'], }, - // hot: true, - // inline: true, + hot: true, compress: false, disableHostCheck: true, stats, diff --git a/webpack.config.dev.js b/webpack.config.dev.js index ad85781..9a8aaff 100644 --- a/webpack.config.dev.js +++ b/webpack.config.dev.js @@ -17,9 +17,6 @@ module.exports = require('./webpack.config.base')({ entry: { front: [ - // activate HMR for React - 'react-hot-loader/patch', - // bundle the client for webpack-dev-server // and connect to the provided endpoint `webpack-dev-server/client?http://${host}:${port}`, From dbb8d7e5b633ff55fc72154d1b2e009116b227e0 Mon Sep 17 00:00:00 2001 From: Suraj Chandola Date: Wed, 21 Nov 2018 01:17:16 +0530 Subject: [PATCH 2/4] remove --hot from script --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index dcc547a..1d29fe2 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "test": "jest", "test:watch": "jest --watch", "coverage": "jest --coverage", - "start": "webpack-dev-server --config webpack.config.dev.js --hot", + "start": "webpack-dev-server --config webpack.config.dev.js", "prod": "cross-env NODE_ENV=production webpack-dev-server --config webpack.config.prod.js", "build": "rimraf build && cross-env NODE_ENV=production webpack --config webpack.config.prod.js", "perf": "rimraf *.report.dom.html && npm run build && (npm run serve & lighthouse http://localhost:3000 --view)", From 010c5113920e44f56e7b455877a363bb1afcdc1f Mon Sep 17 00:00:00 2001 From: Suraj Chandola Date: Thu, 22 Nov 2018 17:49:36 +0530 Subject: [PATCH 3/4] fixed HMR --- app/index.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/app/index.js b/app/index.js index 27bf767..6553399 100644 --- a/app/index.js +++ b/app/index.js @@ -24,3 +24,10 @@ const renderApp = (Component: React.ComponentType) => { }; renderApp(App); + +// webpack Hot Module Replacement API +if (module.hot) { + module.hot.accept('./containers/App', () => { + renderApp(App); + }); +} From 6c1ef9f82f0642abdf79adef723992213b747ceb Mon Sep 17 00:00:00 2001 From: Suraj Chandola Date: Thu, 22 Nov 2018 17:51:02 +0530 Subject: [PATCH 4/4] RHL updated to 4.5 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 1d29fe2..fb0ab98 100644 --- a/package.json +++ b/package.json @@ -104,7 +104,7 @@ "prop-types": "15.6.2", "react": "16.6.1", "react-dom": "16.6.1", - "react-hot-loader": "4.3.12", + "react-hot-loader": "4.5.0", "react-redux": "5.0.7", "react-router": "4.3.1", "react-router-dom": "4.3.1",