!Wolf of Wall Street gif

react-broker

A lightweight library for lazy components using React 16.8+. It's perfect for
code splitting and has the simplest SSR story you've ever seen out-of-the-box.

Critically, this package is only intended to work with Webpack, specifically
Webpack 4 and future versions. There are no plans to implement a design
accommodating Parcel or other bundlers. There is also a hard requirement
for babel-plugin-macros (which is shipped with CRA) if you opt to use the macro.

``js
import {BrokerProvider} from 'react-broker'
import lazy from 'react-broker/macro'

// Automatically generates dynamic imports for webpack with babel-plugin-macros.
// Just give it the path.
const LazyPage = lazy('../pages/Page', {loading: props => 'Loading...'})

////////////////////////////////////////////////////////////////////////////////
// ⬇ BECOMES ⬇ //
///////////////////////////////////////////////////////////////////////////////

const LazyPage =
require('react-broker').lazy(
'src/pages/Page',
() => import(/ webpackChunkName: "src/pages/Page" / '../pages/Page'),
{loading: props => 'Loading...'}
)

function App () {
// Look at me! I'm used like a normal component.
return (



)
}
`

$3


- Webpack 4+ (because chunks)
- React 16.8+ (because hooks)
- Babel (because babel-plugin-macros)

$3

yarn add react-broker or npm i react-broker

$3

Hello world

Hello world w/ Router

--------------------------------------------------------------------------------

Documentation

$3

The function that transforms your imports and delegates your async components.

`js
import lazy from 'react-broker/macro'
`

#### lazy(component , options