$ mkdir react-redux-webpack && cd react-redux-webpack
$ npm init . -f
$ npm i --save react react-dom redux react-redux immutable
$ npm i --save-dev webpack babel-loader babel-preset-es2015 babel-preset-stage-2 babel-preset-react # babel-preset-stage-0 for lower
$ # to add es7 async features
$ npm i -D babel-plugin-syntax-async-functions babel-plugin-transform-regenerator babel-polyfill
$ npm i -S babel-polyfill
Configure webpack.config.js
module.exports = {
entry: './src/app.js',
output: {
path: __dirname,
filename: 'bundle.js'
},
module: {
loaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel',
query: { presets: [ 'es2015', 'stage-2', 'react' ] }
}
]
}
};
Babel config
$ vi .babelrc
{
"presets": ["es2015"],
"plugins": ["syntax-async-functions","transform-regenerator"]
}
Add following to package.json
"script": {
"build": "webpack --debug"
}
Configure flow
touch .flowconfig
$ vi .flowconfig
[options]
suppress_type=$FlowIssue
For es7 async support
$ npm i -S bluebird
$ npm i -D babel-preset-async-to-bluebird
$ # add 'async-to-bluebird' to the query presets
$ vi webpack.config.js
module.exports = {
entry: './app.js',
output: {
path: __dirname,
filename: 'bundle.js'
},
module: {
loaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel',
query: { presets: [ 'es2015', 'stage-2', 'react', 'async-to-bluebird' ] }
}
]
}
};