[BUG]: Multiple exports break hot reloading
Created by: eccentric-j
Describe the bug
When a component file contains more than one export, CRA cannot hot-reload it.
Did you try recovering your dependencies?
Yes, experienced it on our work repo. Reproduced it in another person's test reproduction repo who ran into it, and then moments ago created a brand new create-react-app app and reproduced the issue again.
Which terms did you search for in User Guide?
- Multiple exports found https://create-react-app.dev/docs/importing-a-component/#dangerbuttonjs which doesn't mention anything about an issue like this
- Hot Module Replacement
- Hot Reloading
- Fast Reload
- Reloading
Environment
> npx create-react-app --info
Environment Info:
current version of create-react-app: 4.0.3
running from /Users/j/.npm/_npx/c67e74de0542c87c/node_modules/create-react-app
System:
OS: macOS 11.2.3
CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
Binaries:
Node: 15.11.0 - /usr/local/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 7.6.0 - /usr/local/bin/npm
Browsers:
Chrome: Not Found
Edge: Not Found
Firefox: Not Found
Safari: 14.0.3
npmPackages:
react: ^17.0.2 => 17.0.2
react-dom: ^17.0.2 => 17.0.2
react-scripts: 4.0.3 => 4.0.3
npmGlobalPackages:
create-react-app: Not Found
Steps to reproduce
- Run
npx create-react-app cra-reload-repro
- Open App.js and add this to the very bottom
export const x = 5
. Doesn't seem to matter what is exported. - Run
yarn start
- View in browser
- Edit App.js and change some text, maybe a single word
- Save changes to App.js
Expected behavior
The module is sent via WebSocket to the browser and then the update is applied so the text changes on-screen.
Actual behavior
The module is sent via WebSocket (confirmed in network tab of inspector), but the update is not applied. The text does not change on-screen.
Reproducible demo
https://github.com/eccentric-j/cra-reload-repro
- Clone the repo
- Run yarn start
- Open page in browser
- Change some text in App.js
- Save App.js
Notes
If I should report this to another package or github repo, please point the way!