• export default로 내보내기

const Component = (props) => {
  return (
    <div>Component</div>
  );
};

//// 동일한 기능
export default Component;

export { Component as default };
-----------------------------

//// 모듈 다시 내보내기(동일한 기능)
// index.js
import Component from './Component';
export default Component;

export { default } from './Component';
-----------------------------

• export 로 내보내기

const Component = (props) => {
  return (
    <div>Component</div>
  );
};

export default Component;

//// 모듈 다시 내보내기(동일한 기능)
import Component from './Component';
export { Component };

export { default as Component } from './Component'; // default export -> export

export * from './Component'; // 한번에 내보내기
-----------------------------

//// import
import { Component } from './Component';

//// 모듈 명칭 변경하기
export { Component as ChangeComponent };
import { ChangeComponent } from './Component';

• import default로 가져오기

const Component = (props) => {
  return (
    <div>Component</div>
  );
};

export default Component;

//// 컴포넌트 가져오기(동일한 기능)
import Component from './Component';

import * as WrapperComponent from './Component'; // 한번에 가져오기
const Component = WrapperComponent.default; // default export;
-----------------------------

• import 로 가져오기

const Component = (props) => {
  return (
    <div>Component</div>
  );
};

export { Component };

//// 컴포넌트 가져오기(동일한 기능)
import { Component } from './Component';

import * as WrapperComponent from './Component';// 한번에 가져오기
const Component = WrapperComponent.Component;
-----------------------------

//// 모듈 명칭 변경하기
export { Component as ChangeComponent };
import { ChangeComponent } from './Component';

참고페이지

모듈 내보내고 가져오기