# customize-cra-react-refresh

> Add react-refresh to any create-react-app using customize-cra

Latest version **1.1.0** (published 2020-06-03) · ISC license · 0 weekly downloads

## Install

```sh
npm install customize-cra-react-refresh
pnpm add customize-cra-react-refresh
yarn add customize-cra-react-refresh
bun add customize-cra-react-refresh
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 1.1.0 |
| Published | 2020-06-03 |
| First published | 2020-01-08 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 2.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 160 |
| Author | Ethan Setnik |
| Maintainers | esetnik |

## Links

- npm: https://www.npmjs.com/package/customize-cra-react-refresh
- Repository: https://github.com/esetnik/customize-cra-react-refresh
- Homepage: https://github.com/esetnik/customize-cra-react-refresh#readme
- Issues: https://github.com/esetnik/customize-cra-react-refresh/issues
- npm.io page: https://npm.io/package/customize-cra-react-refresh

## Dependencies (2)

- [react-refresh](https://npm.io/package/react-refresh.md) ^0.8.1
- [@pmmmwh/react-refresh-webpack-plugin](https://npm.io/package/@pmmmwh/react-refresh-webpack-plugin.md) ^0.3.2

## Recent versions

- 1.1.0 (latest) — 2020-06-03
- 1.0.6 — 2020-05-28
- 1.0.5 — 2020-05-28
- 1.0.4 — 2020-05-27
- 1.0.3 — 2020-05-27
- 1.0.1 — 2020-01-08

## README

# Description

Provides a simple, no frills way to integrate `react-refresh` into your `create-react-app` using [customize-cra](https://github.com/arackaf/customize-cra) and [@pmmmwh/react-refresh-webpack-plugin](https://github.com/pmmmwh/react-refresh-webpack-plugin).

# Installation

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"
   }
   ```

# Credits

Original idea based on [comment by @drather19](https://github.com/facebook/react/issues/16604#issuecomment-561961608).

---
_Source: https://npm.io/package/customize-cra-react-refresh · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._