Allows you to load React components asynchronously!
This is a simple Higher-order function that allows you to load React components asynchronously from split chunks.
npm install async-import-react-component --saveYou can use two methods, one is to pass in the function directly, and the other is to pass in as an object.
- Directly
import getAsyncComponent from 'async-import-react-component'
const ComponentOne = getAsyncComponent(() => import('Components/ComponentOne'))- Optically
import getAsyncComponent from 'async-import-react-component'
const ComponentTwo = getAsyncComponent({
resolve: () => import('Components/ComponentTwo'),
loading: <div>ComponentTwo is loading...</div>,
error: <div>An error has occurred, please check the component you import.</div>,
delay: 1000,
})| parameters | description | type | default |
|---|---|---|---|
| resolve | function importing component path | Promise<{ default: ComponentType }> | - |
| loading | prompt when loading | ReactNode | null |
| error | prompt when error | ReactNode | null |
| delay | Set a delay to start importing | number | 0 |
In view of the lack of self writing test ability, please have the ability to write unit test friend can contribute to improve this simple project, I will be very grateful to you.