Skip to content

DEMO: Webpack Flush Chunks + React Universal Component 3.0 πŸš€

License

Notifications You must be signed in to change notification settings

faceyspacey/universal-demo

 
 

Repository files navigation

Edit Redux-First Router Demo

Universal Demo

This demo has been updated to a Webpack 4 implementation

This is a demo of how to use the Universal family of packages:

Feel free to use it as a boilerpate.

Installation

git clone https://github.com/faceyspacey/universal-demo.git
cd universal-demo
yarn
yarn start

Things To Do

  • Open localhost:3000 in your browser

  • Click "CHANGE PAGE" to cycle through dynamically imported pages

  • refresh on any page

  • and then view the source in the browser to see what chunks are being sent on each page

  • view the primary code in: src/components/App.js

  • open the Network tab to see when imports are fetched

  • edit the components to see that HMR works--even for split chunks.

  • edit and save the CSS files to confirm HMR works for CSS as well, thanks to extract-css-chunks-webpack-plugin

  • examine the build folders to see exactly what chunks and files are built for you

Long live the dreams of Universal HMR and Universal Code-Splitting!

Contributing

We use commitizen, so run npm run cm to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. If you see anything wrong, feel free to make a PR.

More from FaceySpacey in Reactlandia

About

DEMO: Webpack Flush Chunks + React Universal Component 3.0 πŸš€

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published