react-async-import-component 📬

Resolve components asynchronously, with support for code splitting and advanced server side rendering use cases.

Installation

npm install react-async-import-component

Usage

import asyncComponent from 'react-async-import-component';

const Component = asyncComponent({
    resolve: () => import(/* webpackChunkName: "Component" */ 'src/xxxx'),
    loading: () => (<div>loading</div>),
    error: () => (<div>Error</div>),
})

const AppRouter = () => (
    <Router>
        <Switch>
            <Route path="/" component={Component} />
        </Switch>
    </Router>
);

or

import asyncComponent from 'react-async-import-component';
const Component = asyncComponent(() => import(/* webpackChunkName: "status" */ 'src/xxxx'));
}

const AppRouter = () => (
    <Router>
        <Switch>
            <Route path="/" component={Component} />
        </Switch>
    </Router>
);