Starter kit for modern web app (React, Bootstrap, jQuery) and bundle logic with Webpack for development (with hot reloading) and for production

Made by Paul Musso

• Output 2 js files, one for app code and other one for dependencies (jQuery, ...)
• SourceMaps for JS, JSX and LESS
• Ressources (fonts and images) lesser than 100Kb are inlined in JS files
• Files generated by Webpack are injected to index.html
• 2 configurations
  • Development (npm run start)
    • Source Maps are inlined in JS files
    • Hot reloading for CSS and React, update changed files without refreshing web app
    • CSS are injected in JS files (for hot reloading)
  • Production (npm run serve or npm run build)
    • Styles exported to a CSS file
    • CSS and JS files are minimized
    • Source Maps are exported to dedicated files
• Use ESLint: check JS syntax at packaging time
• React
  • Enable hot reloading for html (really fast)
• Bootstrap
  • App styles use Less Bootstrap files, useful to change vars like primary color
  • JS files are included in js file for dependencies, like React and JQuery
• JQuery
  • Included in JS file for dependencies
  • It is exposed in global scope as jQuery
• Less (CSS preprocessor)

Ensure you have node greater than version 4 (Code contains es6 syntax)

1. Get repo with git clone https://github.com/paulmusso/webpack-boilerplate.git

2. Delete the existing git repository by running rm -rf .git

3. Run npm install to install the dependencies

npm start

Go to http://localhost:8080 and you should see the app running!

npm run build

Output files are copied to dist folder

npm run serve

This project is licensed under the MIT license