反应导出意外的令牌

Question

所以我有这些文件和文件夹。

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

在list.js中我有export default (props) => (...)

在index.js中我有export UserList from './list';

在App.js中我有import { UserList } from './modules/user';

那里有什么问题吗？因为我得到了

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

但我不明白这里有什么问题？救命啊！

编辑：这里有我的list.js文件的更多详细信息，但我认为它没有区别，因为错误在index.js中

import React from 'react';
// more import
export default (props) => (
  <List {...props}>
    ...
  </List>
);

Answer 1

我看到您直接导出属于另一个文件的组件而不导入它。

你这样做是ES8 Proposal

在ES6中，您可以将组件导出为

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

然后导入为

import { UserList } from './modules/user';

Answer 2

对于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';

对于使用早期babel版本的用户，只需使用commonjs模块。