diff options
Diffstat (limited to 'examples/snowpack/src/pages/guides/react-loadable-components.md')
-rw-r--r-- | examples/snowpack/src/pages/guides/react-loadable-components.md | 38 |
1 files changed, 0 insertions, 38 deletions
diff --git a/examples/snowpack/src/pages/guides/react-loadable-components.md b/examples/snowpack/src/pages/guides/react-loadable-components.md deleted file mode 100644 index d22931b9b..000000000 --- a/examples/snowpack/src/pages/guides/react-loadable-components.md +++ /dev/null @@ -1,38 +0,0 @@ ---- -layout: ../../layouts/content.astro -title: React + Loadable Components -published: false ---- - -<div class="notification"> - This guide has an example repo: - <a href="https://github.com/snowpackjs/snowpack/examples/react-loadable-components">examples/react-loadable-components</a> -</div> - -_Based on [app-template-react][app-template-react]_ - -You can lazy load React components in Snowpack when needed with React‘s builtin `React.lazy` ([docs][react-lazy]): - -```jsx -import React, { useState, useEffect, Suspense } from 'react'; - -const Async = React.lazy(() => import('./Async')); - -function Component() { - return ( - <div> - <Suspense fallback={<div>Loading...</div>}> - <Async /> - </Suspense> - </div> - ); -} -``` - -This works out-of-the-box in Snowpack, with no configuration needed! - -### Learn more - -- [`React.lazy` documentation on reactjs.org][react-lazy] - -[react-lazy]: https://reactjs.org/docs/code-splitting.html#reactlazy |