Simple React Webpack Babel Starter Kit
Tired of complicated starters with 200MB of dependencies which are hard to understand and modify?
What's in it?
- Simple src/index.jsx and src/index.css (local module css).
- Webpack configuration for development (with hot reloading) and production (with minification).
- CSS module loading, so you can include your css by
import styles from './path/to.css';.
- Both js(x) and css hot loaded during development.
- Webpack Dashboard Plugin on dev server.
git clone https://github.com/alicoding/react-webpack-babel.git
- Then install the dependencies:
- Run development server:
- Or you can run development server with webpack-dashboard:
npm run dev
Open the web browser to
To build the production package
npm run build
Here is an example Nginx config:
There is a .eslint.yaml config for eslint ready with React plugin. To use it, you need to install additional dependencies though:
npm install --save-dev eslint eslint-plugin-react
To do the actual linting, run:
npm run lint
Notes on importing css styles
- styles having /src/ in their absolute path are considered part of the application and exported as local css modules.
- other styles are considered global styles used by many components and are included in the css bundle directly.
Please contribute to the project if you know how to make it better, including this README :)