Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: fast refresh stops on needed bail outs #11105

Merged
merged 2 commits into from
Jul 14, 2021
Merged

fix: fast refresh stops on needed bail outs #11105

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
33309cf
fix: fast refresh stops on needed bail outs
pmmmwh Jun 15, 2021
1156f1e
chore: better heuristic to skip unnecessary reloads
pmmmwh Jun 15, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 19 additions & 5 deletions packages/react-dev-utils/webpackHotDevClient.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -230,6 +230,18 @@ function canApplyUpdates() {
return module.hot.status() === 'idle';
}

function canAcceptErrors() {
// NOTE: This var is injected by Webpack's DefinePlugin, and is a boolean instead of string.
const hasReactRefresh = process.env.FAST_REFRESH;

const status = module.hot.status();
// React refresh can handle hot-reloading over errors.
// However, when hot-reload status is abort or fail,
// it indicates the current update cannot be applied safely,
// and thus we should bail out to a forced reload for consistency.
return hasReactRefresh && ["abort", "fail"].indexOf(status) === -1
}

// Attempt to update code on the fly, fall back to a hard reload.
function tryApplyUpdates(onHotUpdateSuccess) {
if (!module.hot) {
Expand All @@ -243,11 +255,13 @@ function tryApplyUpdates(onHotUpdateSuccess) {
}

function handleApplyUpdates(err, updatedModules) {
// NOTE: This var is injected by Webpack's DefinePlugin, and is a boolean instead of string.
const hasReactRefresh = process.env.FAST_REFRESH;
const wantsForcedReload = err || !updatedModules || hadRuntimeError;
// React refresh can handle hot-reloading over errors.
if (!hasReactRefresh && wantsForcedReload) {
const haveErrors = err || hadRuntimeError;
// When there is no error but updatedModules is unavailable,
// it indicates a critical failure in hot-reloading,
// e.g. server is not ready to serve new bundle,
// and hence we need to do a forced reload.
const needsForcedReload = !err && !updatedModules;
if ((haveErrors && !canAcceptErrors()) || needsForcedReload) {
window.location.reload();
return;
}
Expand Down