43 lines
1.1 KiB
JavaScript
43 lines
1.1 KiB
JavaScript
import React from 'react'
|
|
import Header from '../components/Header'
|
|
import Counter from '../components/Counter'
|
|
import dynamic from 'next/dynamic'
|
|
import { asyncReactor } from 'async-reactor'
|
|
|
|
const DynamicComponent = dynamic(import('../components/hello1'))
|
|
const DynamicComponentWithCustomLoading = dynamic(
|
|
import('../components/hello2'),
|
|
{
|
|
loading: () => (<p>...</p>)
|
|
}
|
|
)
|
|
const DynamicComponentWithNoSSR = dynamic(
|
|
import('../components/hello3'),
|
|
{ ssr: false }
|
|
)
|
|
const DynamicComponentWithAsyncReactor = asyncReactor(async () => {
|
|
const Hello4 = await import('../components/hello4')
|
|
return (<Hello4 />)
|
|
})
|
|
|
|
const DynamicComponent5 = dynamic(import('../components/hello5'))
|
|
|
|
export default () => (
|
|
<div>
|
|
<Header />
|
|
<DynamicComponent />
|
|
<DynamicComponentWithCustomLoading />
|
|
<DynamicComponentWithNoSSR />
|
|
<DynamicComponentWithAsyncReactor />
|
|
{
|
|
/*
|
|
Since DynamicComponent5 does not render in the client,
|
|
it won't get downloaded.
|
|
*/
|
|
}
|
|
{ React.noSuchField === true ? <DynamicComponent5 /> : null }
|
|
|
|
<p>HOME PAGE is here!</p>
|
|
<Counter />
|
|
</div>
|
|
)
|