A boilerplate setup for React, with Redux, Webpack, NPM, Sass, Typescript, and ES6.
react-hot: allows instantaneous live refresh without losing state while editing React components
ts-loader: pre-compiles typescript
strip-loader: strips custom functions from your code (eg. console.log) in production
These loaders are listed here in order of transformation but appear in the config right-to-left.
autoprefixer: PostCSS plugin to parse CSS and add vendor prefixes to CSS rules
css-loader: resolves @import at-rules and url(…) values as require()
file-loader: emits font assets as files in the output directory
file-loader: emits image assets as files in the output directory
ExtractTextPlugin: moves required css from JS into a file .css file
HtmlWebpackPlugin: injects resources into index.html
webpack.HotModuleReplacementPlugin: exchanges, adds, or removes modules while an application is running without a page reload
webpack.DefinePlugin: allows you to create global constants which can be configured at compile time
source-map-loader: uses any TypeScript-generated sourcemaps in webpack sourcemaps
Available Global Constants:
NODE_ENV: The build environment passed with webpack command as
- defaults to
- defaults to
VERSION: The package.json version number (eg.
- [X] Implement a build process
- [ ] Build some React components (Maybe a notes app with tagging)
- [ ] Add unit tests
- [ ] Use localStorage for persiting data
- [ ] Build and deploy to Github.io page