IT技术 - react出口意外令牌 - 吾爱随笔录

IT技术 javascript reactjs

2021-05-10 13:23:59

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

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>
);

2个回答

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

你这样做的方式是一个ES8 提案

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

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

然后导入为

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

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

在此之后，module的导出将按照以下方式从 index.js 工作：

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

对于那些使用早期 babel 版本的人，只需使用 commonjs module。

其它你可能感兴趣的问题