Started from https://www.robinwieruch.de/minimal-react-webpack-babel-setup/ and added:
- Hot Module Replacement for development (also see Webpack's Docs on HMR),
- Tree Shaking for production.
node
and yarn
installed.
- Install Node: https://nodejs.org/en/download/
- Install Yarn: https://yarnpkg.com/en/docs/install
- Clone the repo:
$> git clone https://github.com/cassilup/react-hot-module-replace-tree-shake
- Install dependencies:
$> yarn
$> yarn start
And navigate to http://localhost:8080 to see it in action.
Any changes to the JS(X) code will be Hot-Module-Replaced into the page (meaning: without a full refresh).
$> yarn dist
...and you now have the dist/
folder holding both index.html
as well as the app packaged in bundle.js
.
Enjoy. :)