From 08bfdfad67683d3d8df8c4e163bf0e6981ca2937 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Mon, 24 Jun 2019 09:45:29 -0700 Subject: [PATCH] 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 --- Libraries/Core/setUpReactRefresh.js | 45 +++++++++++++++++++---------- Libraries/Utilities/HMRClient.js | 25 +++++++++++----- 2 files changed, 47 insertions(+), 23 deletions(-) diff --git a/Libraries/Core/setUpReactRefresh.js b/Libraries/Core/setUpReactRefresh.js index f68b8cfc77d..ffd698c50ab 100644 --- a/Libraries/Core/setUpReactRefresh.js +++ b/Libraries/Core/setUpReactRefresh.js @@ -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; } diff --git a/Libraries/Utilities/HMRClient.js b/Libraries/Utilities/HMRClient.js index fbe236402df..9e02f9bf2e0 100644 --- a/Libraries/Utilities/HMRClient.js +++ b/Libraries/Utilities/HMRClient.js @@ -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 => {