"export default from" doesn't work with Babel React

Use the following syntax:

File: layouts/index.js

export {default as Flex} from './flex'
export {default as Grid} from './grid'
export {default as Dock} from './dock'

Then you can use

import { Dock, Grid } from 'layouts'

or

import layouts from 'layouts'

<layouts.Flex >...</layouts.Flex>

---

In order to export nested indices created by the above method you can use export * syntax:

File: icons/index.js

export * as action from './action';
export * as alert from './alert';
export * as av from './av';

Usage:

import * as icons from 'material/icons'

<icons.action.Close />

To use this construction:

export default from './Button';

we need to use preset-stage-1.

How to use

1. npm install babel-preset-stage-1 --save-dev
2. edit file package.json and add stage-1 to the presets section in babel.

Example of package.json

"babel": {
  "presets": [
    "es2015",
    "stage-1",
    "react"
  ]
},

More info

It's a proposal to the ECMAScript - https://github.com/leebyron/ecmascript-export-default-from (still in review).