Remove useless module.hot checks

Summary:
Since we always create `module.hot` objects, the `module.hot` checks were unnecessary. They give a false impression that we're checking for a Hot Reloading mode. However, they're just Flow refinements and always exist in DEV. I made that explicit by throwing early.

Similarly, I removed a `module.hot` check inside `setupReactRefresh`, as it is always truish in DEV.

Finally, I'm adding a new mechanism as an escape hatch. It lets you do:

```
if (__DEV__) {
  require.Refresh.forceFullRefresh = true;
}
```

in your entry point and opt into full refreshes on every edit. This sounds similar to "Reload-on-Save". That is because in the next diff, I plan to remove "Reload-on-Save" from user-visible options (but it'll stay for automated workflows).

So this workaround is intended for people who for one reason or another don't want to opt into Hot Reloading as an alternative. We'll need to talk to them and find out why.

Reviewed By: rickhanlonii

Differential Revision: D15958475

fbshipit-source-id: 674187ddf86a4e286dfae28f4182555a8b5d7396
This commit is contained in:
Dan Abramov
2019-06-24 09:48:57 -07:00
committed by Facebook Github Bot
parent 1f04ff580d
commit 08bfdfad67
2 changed files with 47 additions and 23 deletions
+29 -16
View File
@@ -17,22 +17,35 @@ if (__DEV__) {
throw new Error('Could not find the reload() implementation.');
}
if ((module: any).hot) {
// This needs to run before the renderer initializes.
const ReactRefreshRuntime = require('react-refresh/runtime');
ReactRefreshRuntime.injectIntoGlobalHook(global);
// This needs to run before the renderer initializes.
const ReactRefreshRuntime = require('react-refresh/runtime');
ReactRefreshRuntime.injectIntoGlobalHook(global);
(require: any).Refresh = {
// Full Refresh
performFullRefresh() {
const Refresh = {
// This can be set from the app as a workaround
// if you really want a full reload on every change:
// if (__DEV__) require.Refresh.forceFullRefresh = true;
forceFullRefresh: false,
performFullRefresh() {
NativeDevSettings.reload();
},
createSignatureFunctionForTransform:
ReactRefreshRuntime.createSignatureFunctionForTransform,
isLikelyComponentType: ReactRefreshRuntime.isLikelyComponentType,
register: ReactRefreshRuntime.register,
performReactRefresh() {
if (Refresh.forceFullRefresh) {
NativeDevSettings.reload();
},
// React Refresh
createSignatureFunctionForTransform:
ReactRefreshRuntime.createSignatureFunctionForTransform,
isLikelyComponentType: ReactRefreshRuntime.isLikelyComponentType,
register: ReactRefreshRuntime.register,
performReactRefresh: ReactRefreshRuntime.performReactRefresh,
};
}
} else {
ReactRefreshRuntime.performReactRefresh();
}
},
};
(require: any).Refresh = Refresh;
}
+18 -7
View File
@@ -130,20 +130,33 @@ Error: ${e.message}`;
throw new Error(error);
});
let enableLoadingView = false;
let didFinishInitialUpdate = false;
hmrClient.on('connection-done', () => {
// Don't show the loading view during the initial update.
enableLoadingView = true;
didFinishInitialUpdate = true;
});
// This is intentionally called lazily, as these values change.
function shouldProvideVisualFeedback() {
return (
// Until we get "connection-done", messages aren't real edits.
didFinishInitialUpdate &&
// If HMR is disabled by the user, we're ignoring updates.
hmrClient.shouldApplyUpdates &&
// If full refresh is forced, there's no need to flash the indicator.
// It will be refreshed in a few milliseconds anyway.
!(require: any).Refresh.forceFullRefresh
);
}
hmrClient.on('update-start', () => {
if (hmrClient.shouldApplyUpdates && enableLoadingView) {
if (shouldProvideVisualFeedback()) {
HMRLoadingView.showMessage('Hot Reloading...');
}
});
hmrClient.on('update', () => {
if (hmrClient.shouldApplyUpdates) {
if (shouldProvideVisualFeedback()) {
if (
Platform.OS === 'ios' &&
NativeRedBox != null &&
@@ -161,9 +174,7 @@ Error: ${e.message}`;
});
hmrClient.on('update-done', () => {
if (hmrClient.shouldApplyUpdates && enableLoadingView) {
HMRLoadingView.hide();
}
HMRLoadingView.hide();
});
hmrClient.on('error', data => {