在 React 中导入目录

我在 src 中有一个组件目录，它有一个名为计算器的目录，然后它有 3 个不同的组件，而不是导入所有 3 个我想是否可以只导入目录计算器。

组件之一具有以下代码

 import React from 'react';
import {Textfit} from 'react-textfit';

const Screen = (props) => {
    return (
        <div className="screen--container">
          <Textfit
            max={40}
            throttle={60}
            mode="single"
            className="screen-top"
          >
            { props.expression }
          </Textfit>
          <Textfit
            max={150}
            mode="single"
            className="screen-bottom"
          >
            { props.total }
          </Textfit>
        </div>
      )
}

export default Screen;

然后在我的 App.js 中我有

import React, { Component } from "react";
import Calculator from "./components/calculator";
import "./App.css";

class App extends Component {
  render() {
    return (
      <div className="calculator--container">
        <Calculator.Screen {...this.props} />
        <Calculator.Keypad {...this.props} />
      </div>
    );
  }
}

export default App;

但目前它给了我一个错误如下 ./src/App.js Module not found: Can't resolve './components/calculator' in 'C:.....\react-simple-calculator\src'

我怎样才能使这项工作？

此外，开发人员的原始代码有

export default (props) => {
return ()}

但我已将其更改为

const Screen = (props) => { }
export default Screen;

对吗，第一个是什么意思？我指的代码是：https : //medium.com/@mazinosukah/lets-build-a-calculator-with-redux-and-react-using-tdd-6cb11946bad4