New cra-universal released 🎉

Antony Budianto
Jun 30, 2018 · 2 min read
Image for post
Image for post

Hi, I’m very happy to announce that the latest major version of cra-universal is released! 🎉🎉🎉


First heard about cra-universal? So it’s a CLI for your create-react-app to enable universal app features like server-side rendering, without ejecting at all.

This release includes many improvements and new features:

  • Zero config by default, with customization support!
  • HMR support on server!
  • Isomorphic style support, check here
  • Basic assets support (png, jpg, gif, bmp, svg)

With zero config, it means:

  • One dependency for tooling, easy updates!
  • Customizable
  • No need maintain server/webpack.config.js anymore
  • No need to maintain server/package.json anymore, all server dependencies can be listed on root package.json

Get started

You can bootstrap universal create-react-app with these steps

# Create new cra
$ create-react-app myapp
$ cd myapp

# Install new cra-universal
$ yarn add -D cra-universal

# Start with no config at all!
$ npx cra-universal start
# Start your CRA client
$ npm start

Cool right? Unlike previous version, you don’t need to have server folder anymore, just start right away!


Zero config doesn’t mean you cannot customize it at all, it just means it abstracts away the painful setup and you can still override as you need.

If you prefer to maintain the server like in previous version, it’s supported too. You can still keep your server folder, or to create a new one, you can run:

$ npx cra-universal init

It will bootstrap the server folder inside your CRA client app, it contains server/index.js that handles the listen and log stuff, and server/app.js that handles the app server code. You can also have server/.babelrc file, it’ll use default babel configuration if not provided.

You can also define crau.config.js to override webpack configuration:

// crau.config.js
module.exports = {
webpackPlugins: [], modifyWebpack: config => config}

For now, it’ll only expose webpack and plugins overrides, but I think it should be enough for people to customize as their needs.

Please check out the release note here for more details. You can also visit for official landing and demo, or my personal website at

If you’ve any feedbacks or ideas, please post a reply! I’d like to hear from you.

If you like the article, please share it with your friends, give some claps and star the repo on GitHub.

Thank you for reading!

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store