ES7 React.js with decorators

After 3 hours of toying with gulp & webpack I've successfully found a beautiful, terse way to make webpack successfully transpile ES6, ES7, JSX. No more gulp streams, the following uses webpack alone.


npm install babel-core --save-dev
npm install babel-loader --save-dev
npm install babel-preset-react --save-dev
npm install babel-preset-es2015 --save-dev

# For stage-0 features
npm install babel-preset-stage-0 --save-dev

# If you want to use decorators
npm install babel-plugin-transform-decorators-legacy --save-dev

Next create a top-level .babelrc. The following was the only preset-order that worked for me.

// .babelrc

    presets: ['react', 'es2015', 'stage-0'],
    plugins: [

And inside your webpack config:

// webpack.config.js

    loaders: [
        test: /.jsx?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,

Note: node_modules are excluded since npm packages are generally already distributed as ES5