cra-universal
v5.0.2
Published
Create React App Universal CLI
Downloads
236
Maintainers
Readme
cra-universal
Create React App Universal CLI
Create React App companion for universal app. No eject, zero config with customization, supports string and node stream API
Features
- No eject needed!
- Zero config by default and customizable
- Server-side rendering for your SEO
- Code-splitting that works universally
- The core middleware is fully unit-tested
- Works alongside
react-scripts
, not as replacement
Prerequisites
- Node >= 14.17.5 LTS recommended
- npx is required
Installation
# Create new cra
create-react-app myapp
cd myapp
# Install new cra-universal
yarn add -D cra-universal
# Install peer dependency
yarn add @cra-express/core [email protected]
Existing Projects
# Install new cra-universal
yarn add -D cra-universal
# Install peer dependency
yarn add @cra-express/core [email protected]
# init custom server (optional)
yarn run cra-universal init
#This will copy ./templates/server into the current directory (it should be run on CRA client root)
Client code change
Please update your render method on src/index.js
// before
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);
// after
ReactDOM.hydrateRoot(document.getElementById('root'), <App />);
Development
# Start CRA client
npm start
## Start CRA server, then open http://localhost:3001 in your browser
npx cra-universal start
Production
# Change directory to your project root first, and run:
npx cra-universal build
# This command will build both client and server and put them into `./dist`
# Run locally:
# $ cd dist && npm i
# $ npm run serve
Deployment
- First, follow the Production guide mentioned above.
- Since the bundle used Webpack Node Externals, you need to run
npm install --production
on the copied/dist
, but this time you don't need to install itsdevDependencies
- Use process manager like PM2 to run your server, your run target is ./dist/server/bundle.js
Credit
- Create React App https://github.com/facebook/create-react-app
- Thanks for https://github.com/ayroblu/ssr-create-react-app-v2 for the base!
Support
If you like this project, please kindly support it by becoming a patron at my Patreon page. Thanks!
Sponsors
- Stan Day ([email protected])
Contributors
Code Contributors
This project exists thanks to all the people who contribute. [Contribute].
Financial Contributors
Become a financial contributor and help us sustain our community. [Contribute]
Individuals
Organizations
Support this project with your organization. Your logo will show up here with a link to your website. [Contribute]
License
MIT