[email protected]

• Enable SSR streaming
  • Activate via App.defaultProps = { streaming: true } (false by default)
  • App must be the top-most element being rendered, if possible, put all your providers inside the App
  • If you have custom server, please check the universalRender: (req, res) => <App streaming /> part
  • If you need to conditionally stream (defaultProps is not suited for this), please use custom server and set the streaming prop as you like
• Support TypeScript for custom server code in babel-preset-cra-universal

cra-universal@5

• Supports latest react-scripts@5
• React 18 with Suspense SSR support (using renderToPipeableStream by default)
  • User can still use string renderer (renderToString) by passing:

    import stringRenderer from '@cra-express/universal-loader/lib/renderer/string-renderer';
    ...
    createReactAppExpress({
      handleRender: stringRenderer,
    })
    

• React Babel Automatic Runtime
• Webpack 5 + Babel 7
• Migrate lerna to pnpm
• Updated SVG support
• Updated docs for hydrateRoot changes
• General dependency upgrade
• New demo at Codesandbox

Breaking changes

• express@4 is now a peerDependency, please install it as dependencies on your app
• By default, the SSR renderer will be node stream instead of string, which will support full Suspense features

• TypeScript support

• SVG support using SVGR, credits to @dmitry-zaets

• Use preserve-symlinks to solve React singleton issue (internal only, improve DX for contributor)
• String rendered: return 500 when the renderer has failed (#198)
• Use max-age=31536000 and immutable in Cache-Control (#177) (#182)
• Update react-scripts in group default to the latest version 🚀 (#175)
• Update babel7 in group default to the latest version 🚀 (#173)

Patch:

• fix the issue that exact flag is not being considered and multiple component.getInitialData() might be called, by @ajchili
• Added size limit to url-loader (#134) by @ajchili
• copy lock files if exist to dist (#142) by @ravelab

• Fix error not logged when running build
• Added new babel plugin: "@babel/plugin-proposal-class-properties"

For the new major (v4.0.0) release, there'll be some breaking changes:

Breaking changes

• Babel 7 update

  • Since Babel 7 introduces some new scoped packages, please update to their new package (env -> @babel/preset-env, react -> @babel/preset-react, transform-object-rest-spread -> @babel/plugin-proposal-object-rest-spread)
  • Update all your preset stages to its individual plugins
  • module.exports is readonly now (if used together with import syntax), please update your code accordingly (Babel 7 related)

• The default of handleRender will be stringRenderer, due many node stream limitation and 3rd party lib support

• New API for universalRender callback. It will only accept return value of:

  • either React element or
  • Promise (that resolves React element)

  // before: you still call rTS explicitly despite having stringRenderer declared...
  {
    handleRender: stringRenderer,
    universalRender: (req, res) => renderToString(<App />)
  }
  

   // after: just return React element! (or Promise of React element)
   {
     universalRender: (req, res) => <App />
   }
  

   // Need to do Nodestream render? Just pass streamRenderer to `handleRender`
   import { streamRenderer } from '@cra-express/universal-loader'
   {
     universalRender: (req, res) => <App />,
     handleRender: streamRenderer
   }
  
   // Want to custom handleRender yourself? Possible now!
   function customRenderer(req, res, reactEl, htmlData, options) { ... }
  

• handleUniversalRender helper on @cra-express/core is removed, since it won't be compatible with new API.

   // before
   universalRender: handleUniversalRender(<App />)
  
   // after
   universalRender: () => <App />
  

Features

• Babel 7
• New universalRender API
• NODE_PATH support

• Fixed bug where you cannot import external css files (from node_modules)

• Fix multiview start (#61) a498df9