on master help sign in
Merge pull request #181 from urbit/feat/hot-reload-v2
c7bc9abMatt Condon
config-overrides.js+7
@@ -1,6 +1,13 @@
1const rewireReactHotLoader = require('react-app-rewire-hot-loader');
1const rewireReactHotLoader = require('react-app-rewire-hot-loader');
2+const rewireAliases = require('react-app-rewire-aliases');
3+
4+const alias = rewireAliases.aliasesOptions({
5+ 'react-dom': '@hot-loader/react-dom',
6+});
2
7
3module.exports = function override(config, env) {
8module.exports = function override(config, env) {
4 config = rewireReactHotLoader(config, env);
9 config = rewireReactHotLoader(config, env);
10+ config = alias(config, env);
11+
5 return config;
12 return config;
6};
13};
package-lock.json+18−11
@@ -1254,6 +1254,17 @@
1254 "@hapi/hoek": "6.x.x"
1254 "@hapi/hoek": "6.x.x"
1255 }
1255 }
1256 },
1256 },
1257+ "@hot-loader/react-dom": {
1258+ "version": "16.8.6",
1259+ "resolved": "https://registry.npmjs.org/@hot-loader/react-dom/-/react-dom-16.8.6.tgz",
1260+ "integrity": "sha512-+JHIYh33FVglJYZAUtRjfT5qZoT2mueJGNzU5weS2CVw26BgbxGKSujlJhO85BaRbg8sqNWyW1hYBILgK3ZCgA==",
1261+ "requires": {
1262+ "loose-envify": "^1.1.0",
1263+ "object-assign": "^4.1.1",
1264+ "prop-types": "^15.6.2",
1265+ "scheduler": "^0.13.6"
1266+ }
1267+ },
1257 "@jest/console": {
1268 "@jest/console": {
1258 "version": "24.7.1",
1269 "version": "24.7.1",
1259 "resolved": "https://registry.npmjs.org/@jest/console/-/console-24.7.1.tgz",
1270 "resolved": "https://registry.npmjs.org/@jest/console/-/console-24.7.1.tgz",
@@ -14261,6 +14272,12 @@
14261 }
14272 }
14262 }
14273 }
14263 },
14274 },
14275+ "react-app-rewire-aliases": {
14276+ "version": "0.2.0",
14277+ "resolved": "https://registry.npmjs.org/react-app-rewire-aliases/-/react-app-rewire-aliases-0.2.0.tgz",
14278+ "integrity": "sha1-71/8AJnuwFJ5lJ+rjUmDwVVqHB4=",
14279+ "dev": true
14280+ },
14264 "react-app-rewire-hot-loader": {
14281 "react-app-rewire-hot-loader": {
14265 "version": "2.0.1",
14282 "version": "2.0.1",
14266 "resolved": "https://registry.npmjs.org/react-app-rewire-hot-loader/-/react-app-rewire-hot-loader-2.0.1.tgz",
14283 "resolved": "https://registry.npmjs.org/react-app-rewire-hot-loader/-/react-app-rewire-hot-loader-2.0.1.tgz",
@@ -14270,6 +14287,7 @@
14270 "version": "2.1.3",
14287 "version": "2.1.3",
14271 "resolved": "https://registry.npmjs.org/react-app-rewired/-/react-app-rewired-2.1.3.tgz",
14288 "resolved": "https://registry.npmjs.org/react-app-rewired/-/react-app-rewired-2.1.3.tgz",
14272 "integrity": "sha512-NXC2EsQrnEMV7xD70rHcBq0B4PSEzjY/K2m/e+GRgit2jZO/uZApnpCZSKvIX2leLRN69Sqf2id0VXZ1F62CDw==",
14289 "integrity": "sha512-NXC2EsQrnEMV7xD70rHcBq0B4PSEzjY/K2m/e+GRgit2jZO/uZApnpCZSKvIX2leLRN69Sqf2id0VXZ1F62CDw==",
14290+ "dev": true,
14273 "requires": {
14291 "requires": {
14274 "cross-spawn": "^6.0.5",
14292 "cross-spawn": "^6.0.5",
14275 "dotenv": "^6.2.0",
14293 "dotenv": "^6.2.0",
@@ -14423,17 +14441,6 @@
14423 }
14441 }
14424 }
14442 }
14425 },
14443 },
14426− "react-dom": {
14427− "version": "16.8.6",
14428− "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.8.6.tgz",
14429− "integrity": "sha512-1nL7PIq9LTL3fthPqwkvr2zY7phIPjYrT0jp4HjyEQrEROnw4dG41VVwi/wfoCneoleqrNX7iAD+pXebJZwrwA==",
14430− "requires": {
14431− "loose-envify": "^1.1.0",
14432− "object-assign": "^4.1.1",
14433− "prop-types": "^15.6.2",
14434− "scheduler": "^0.13.6"
14435− }
14436− },
14437 "react-error-overlay": {
14444 "react-error-overlay": {
14438 "version": "5.1.6",
14445 "version": "5.1.6",
14439 "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-5.1.6.tgz",
14446 "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-5.1.6.tgz",
package.json+3−2
@@ -14,6 +14,7 @@
14 "node": "11.0.0"
14 "node": "11.0.0"
15 },
15 },
16 "dependencies": {
16 "dependencies": {
17+ "@hot-loader/react-dom": "^16.8.6",
17 "@ledgerhq/hw-app-eth": "^4.61.0",
18 "@ledgerhq/hw-app-eth": "^4.61.0",
18 "@ledgerhq/hw-transport-u2f": "^4.61.0",
19 "@ledgerhq/hw-transport-u2f": "^4.61.0",
19 "PaperCollateralRenderer": "github:urbit/PaperCollateralRenderer",
20 "PaperCollateralRenderer": "github:urbit/PaperCollateralRenderer",
@@ -35,8 +36,6 @@
35 "prop-types": "^15.6.2",
36 "prop-types": "^15.6.2",
36 "react": "^16.8.6",
37 "react": "^16.8.6",
37 "react-app-rewire-hot-loader": "^2.0.1",
38 "react-app-rewire-hot-loader": "^2.0.1",
38− "react-app-rewired": "^2.1.3",
39− "react-dom": "^16.8.6",
40 "react-hot-loader": "^4.12.0",
39 "react-hot-loader": "^4.12.0",
41 "react-scripts": "3.0.1",
40 "react-scripts": "3.0.1",
42 "react-teleporter": "^1.1.0",
41 "react-teleporter": "^1.1.0",
@@ -57,6 +56,8 @@
57 "node-sass": "^4.12.0",
56 "node-sass": "^4.12.0",
58 "npm-run-all": "^4.1.3",
57 "npm-run-all": "^4.1.3",
59 "prettier": "^1.18.2",
58 "prettier": "^1.18.2",
59+ "react-app-rewire-aliases": "^0.2.0",
60+ "react-app-rewired": "^2.1.3",
60 "serve": "^11.0.1",
61 "serve": "^11.0.1",
61 "source-map-explorer": "^2.0.0",
62 "source-map-explorer": "^2.0.0",
62 "truffle": "4.1.11"
63 "truffle": "4.1.11"
src/Bridge.js+4−1
@@ -1,4 +1,5 @@
1import React from 'react';
1import React from 'react';
2+import { hot } from 'react-hot-loader/root';
2import { Just, Nothing } from 'folktale/maybe';
3import { Just, Nothing } from 'folktale/maybe';
3import { IndigoApp } from 'indigo-react';
4import { IndigoApp } from 'indigo-react';
4
5
@@ -36,7 +37,7 @@ const INITIAL_MNEMONIC = IS_STUBBED
36 : Nothing();
37 : Nothing();
37const INITIAL_POINT_CURSOR = IS_STUBBED ? Just(65792) : Nothing();
38const INITIAL_POINT_CURSOR = IS_STUBBED ? Just(65792) : Nothing();
38
39
39−export default function Bridge() {
40+function Bridge() {
40 return (
41 return (
41 <Provider
42 <Provider
42 views={ROUTES}
43 views={ROUTES}
@@ -52,3 +53,5 @@ export default function Bridge() {
52 </Provider>
53 </Provider>
53 );
54 );
54}
55}
56+
57+export default process.env.NODE_ENV === 'development' ? hot(Bridge) : Bridge;
src/index.js+1−18
@@ -1,23 +1,6 @@
1import React from 'react';
1import React from 'react';
2import ReactDOM from 'react-dom';
2import ReactDOM from 'react-dom';
3−import { AppContainer } from 'react-hot-loader';
4
3
5import Bridge from './Bridge';
4import Bridge from './Bridge';
6
5
7−const render = () =>
8− ReactDOM.render(
9− <AppContainer>
10− <Bridge />
11− </AppContainer>,
12− document.getElementById('root')
6+ReactDOM.render(<Bridge />, document.getElementById('root'));
13− );
14−
15−// Render once
16−render();
17−
18−// Webpack Hot Module Replacement API
19−if (module.hot) {
20− module.hot.accept('./Bridge', () => {
21− render();
22− });
23−}