[JS]여러개의 js파일을 export 할 때 쓸 수 있는 방법

import와 export는 javascript 나 typescript를 사용하면서 필수불가결한 요소이다.
목적에 따라 코드들을 모듈화해서 파일로 만들어주고 또 비슷한 역할을 하는 파일을 묶어 폴더에 넣어준다.
필요한 함수나 변수를 불러올 때(import) 특정 폴더에 있는 모든 파일의 함수를 데려오고 싶은데 타이핑을 일일이 쳐주는 것이 번거롭기 때문에 다음과 같은 스펙을 사용한다.

 

page 라는 폴더 안에는 news-detail 파일과 news-feed 파일이 있다. 각 파일에는 NewsDetailNews 함수와 NewsFeedView 함수를 export 하고 있다.

 

폴더 안에 index.js 파일을 만든다. (typescript 라면 index.ts )
파일 안에는 다음과 같이 작성.

 

export { default as NewsDetailView } from "./news-detail";
export { default as NewsFeedView } from "./news-feed";

 

news-feed 파일의 NewsFeedView 함수를 default로 내보낸다는 의미.

그리고 가져오는 파일에서는

 

import {NewsDtailView & NewsFeedView } from './page';

 

로 작성하면 번거러움을 줄이며 한 폴더 안의 모든 파일의 함수를 가져올 수 있다.