Add react-refresh to any create-react-app using customize-cra
npm install customize-cra-react-refreshProvides a simple, no frills way to integrate react-refresh into your create-react-app using customize-cra and @pmmmwh/react-refresh-webpack-plugin.
1. Install dependencies
```
npm install -D react-app-rewired customize-cra customize-cra-react-refresh
2. Create or update your config-overrides.js
`js
const { override } = require("customize-cra");
const { addReactRefresh } = require("customize-cra-react-refresh");
/ config-overrides.js /
module.exports = override(addReactRefresh());
3. 'Flip' the existing calls to react-scripts in npm scripts for start, build and test
`diff
/ package.json /
"scripts": {
- "start": "react-scripts start",
+ "start": "react-app-rewired start",
- "build": "react-scripts build",
+ "build": "react-app-rewired build",
- "test": "react-scripts test --env=jsdom",
+ "test": "react-app-rewired test --env=jsdom",
"eject": "react-scripts eject"
}
``
Original idea based on comment by @drather19.