Reaction Export Unexpected Token

So, I have these files and folders.

App.js
modules/
  user/
    index.js
    list.js

In list.js I have export default (props) => (...)

In index.js, I have export UserList from './list';

And in App.js I have import { UserList } from './modules/user';

Something is wrong? Because i got

./src/modules/user/index.js
Syntax error: Unexpected token, expected { (1:7)
> 1 | export UserList from './list';

But I do not understand what is wrong here? Help!

Edit: here is more detailed information about my list.js file, but I don't think it matters because the error is listed in index.js

import React from 'react';
// more import
export default (props) => (
  <List {...props}>
    ...
  </List>
);
+6
source share
2 answers

I see that you are exporting a component that belongs to another file without importing it.

How do you do this ES8 Proposal

In ES6, you can export a component as

 export {default as UserList} from './list'

and then import as

import { UserList } from './modules/user';
+13
source

For users of Babel 6

babel-plugin-transform-export-extensions .babelrc :

  "plugins": [
    "babel-plugin-transform-export-extensions",
    "transform-es2015-modules-commonjs"
  ]

:

npm install --save-dev babel-plugin-transform-export-extensions
npm install --save-dev babel-plugin-transform-es2015-modules-commonjs

index.js:

export simpleRestClient from './simple';
export jsonServerRestClient from './jsonServer';
export * from './types';

, , commonjs.

+1

All Articles