Skip to content
GitLab

feat: better refresh plugin integration

Merged Administrator requested to merge github/fork/pmmmwh/feat/refresh-plugin-overlay into master

Created by: pmmmwh

I've just released 0.4.x stable for the fast refresh plugin, and didn't want CRA to release 4.0 depending on a beta version, so I decided to PR the related changes 😺

Changes

  • Bumped @pmmmwh/react-refresh-webpack-plugin from 0.4.0-beta.8 to 0.4.1 (latest stable)
  • Added interop to enable the plugin to use react-error-overlay instead of the bundled overlay, unifying the error experience for CRA users
    • This is needed because only the plugin will be able to catch module initialization errors (during HMR);
    • I think keeping a cohesive experience throughout the usage of CRA is a good thing;
    • This would save a few kilobytes since the plugin will not inject the bundled stuff (overlay files and socket files).
  • Fixed a longstanding flow issue in the overlay

Verification/Testing

  1. Create a new CRA project with both the current and this patched version
  2. Start the app, make sure it is fully loaded
  3. Throw an error during module initialisation in App.js (i.e. outside of the App function component)

Before

Error overlay before changes

After

Error overlay after changes

Questions

One thing I'm not sure is where to put the overlay interop - I assumed it is OK to put in react-dev-utils (since I also see immer there), but I'm open to moving it anywhere.

Excited for CRA v4 to ship with fast refresh enabled by default 🥰 !