Overview
react-app-rewired is a tool to tweak the create-react-app
webpack config(s) without using 'eject' and without creating a fork of the react-scripts.
It provides all the benefits of create-react-app
without the limitation of a locked-down configuration. You can add webpack plugins, loaders, and other advanced customizations to fit your project's needs.
The Catch: You Own the Configuration
It is critical to understand that using react-app-rewired
means you are intentionally breaking the guarantees provided by the Create React App team. Once you modify the underlying configuration, you "own" it.
"Stuff can break" — Dan Abramov https://twitter.com/dan_abramov/status/1045809734069170176
By proceeding, you take responsibility for the webpack, Jest, and development server configurations. While this provides immense flexibility, it also means that issues arising from your custom configuration will not be supported by the Create React App team or this project. Proceed with caution.
Why This Project Exists
Create React App is an exceptional tool for bootstrapping React applications. However, its "zero-configuration" philosophy means that to customize the build process, you must use the eject
script. Ejecting is a one-way operation that copies all of CRA's configuration and build scripts into your project, severing the link to future react-scripts
updates.
react-app-rewired
was created to provide a middle ground. It allows you to override parts of the configuration in a single file (config-overrides.js
) while still benefiting from the managed react-scripts
dependency. For a more detailed explanation, see the original article: Create React App — But I don’t wanna Eject.
Alternatives
As of Create React App 2.0, this project is lightly maintained, primarily by the community. Several excellent alternatives have emerged that offer a more structured approach to configuration overrides:
- customize-cra: Provides a set of CRA 2.0+ compatible rewirers and helper functions.
- Rescripts: An alternative framework for extending CRA configurations.
- craco: Another popular configuration layer for Create React App.