Note: this is a one-way operation. Once you eject, you can’t go back!
What Create React App Does? π€
Create React App is a convenient tool that allows us to develop React application without having to configure the required build tools.
npx create-react-app my-app
The above command creates a new React app with cra-template (Built by developers at Facebook) and all required configurations.
In the past, creating a React app was a very painful process. You had to slog through a lot of configuration, especially with webpack and Babel.
Every configuration required for the React app comes through the react-scripts package. Located in package.json
file’s script
section.
But it’s an opinionated tool, which means there will always be some unsupported “way” of building React application.
Advantages of Create React App π
- It helps us to create and configure React project in smooth and easy manner.
- Project is structured by default. All the components changes will be done in source folder.
- React-scripts package is pre-installed which has Babel and Webpack configuration for you to run and deploy your project easily.
- Compiler ,Build and Test environment is set up using this command. For testing @testing-library/jest-dom and @testing-library/react is already installed.
Drawbacks of Create React App? π
- Opinionated setup (like almost all tools).
- Hard to configure.
## react-scripts π
It
basically encapsulates all the configurations and boilerplate in a single dependency so you won't have to configure the complete project from scratch.
However, there might be a case where you want to override those configurations for build customization or something more specific.
Hence, it provides eject
functionality so you can take control over those configurations. Including lint, bundling, code-splitting, etc.
`npm run eject` π«
The Create React App documentation characterizes
you aren’t satisfied with the build tool and configuration choices, you can eject at any time. This command will remove the single build dependency from your project.
The eject script gives you full control over the React app configuration. For example, you can customize the webpack or Babel configuration according to a specific need by ejecting the React app.
Why are you ejecting ? π€
- “You want full control over your project.”
- “Create-React-App is missing a feature that I need.
- “You are curious about the build process and want to learn how it works.”
Alternatives to `npm run eject` ? π½
- https://github.com/dilanx/craco
- https://github.com/harrysolovay/rescripts
- https://github.com/arackaf/customize-cra
- https://auth0.com/blog/how-to-configure-create-react-app/
Conclusion π
why burn that bridge before you’ve even used it?
Ejecting lets you customize anything, but from that point on you have to maintain the configuration and scripts yourself.
Don’t eject until you have a specific reason to do so.
Ejecting is a one-way process and makes your configuration more complex.
Comments
Post a Comment