reactjs - 用于在一个文件中导出模块的 es6 语法

Question

我想要一个 index.js 来定义我的所有 React 组件，如下所示:

import App from './app';
import Home from './home';

export App;
export Home;

然后我在另一个文件中引用它们:

import { App, Home } from './components/index';

ReactDOM.render(
  <Provider store={store}>
    <Router history={history}>
      <Route path="/" component={App}>
        <IndexRoute component={Home}/>
      </Route>
    </Router>
  </Provider>,
  document.getElementById('theContent')
);

但我收到此错误:

Module build failed: SyntaxError: /Users/paulcowan/projects/liverpool-managers/client/app/components/index.js: Unexpected token (4:10)
  2 | import Home from './home';
  3 | 
> 4 | export App;
    |           ^

Answer 1

导出如下图。

import App from './app';
import Home from './home';

export {App, Home};

希望这个对你有用。

或者，您可以按如下方式编写导入(命名对象引用)

import * as Components from './components/index';

ReactDOM.render(
  <Provider store={store}>
    <Router history={history}>
      <Route path="/" component={Components.App}>
        <IndexRoute component={Components.Home}/>
      </Route>
    </Router>
  </Provider>,
  document.getElementById('theContent')
);