한 폴더에 있는 여러가지 파일을 묶어서 한번에 export 하는 방법이다.

기존 방식

index.js
App.js
src 
 -components
  -Talbe.js
  -Main.js
  -Label.js
import Talbe from '../components/Table';
import Main from '../components/Main';
import Label from '../components/Label';

편하게 import 하려면?

  1. export {default as Component} ‘./Compoents’
// components 폴더 내에 index.js를 만들어서 export 코드를 입력해준다.

export { default as Table } "./Table ";
export { default as Main } "./Main ";
export { default as Label } "./Label ";
import {Table,Main.Label} from '../compoennts'
  1. require.context()

사용법

const importer = require.context(directory,true,regExp);
// directory => 가져올 디렉토리 위치
// true => useSubdirectories 즉, directory의 하위 폴더까지 가져올거냐는 의미
// regExp => 정규식, 가져올 파일들을 필터링 할 수 있다.

ex)

const importer = require.context('./backgroundImages',true,'/\\.(png|jpe?g|svg)$/')

// ./backgroundImages 에서 하위 폴더까지 포함해서 해당 확장자를 가진 파일들을 가져온다.