export와 export default의 차이점

파일을 모듈화 시켜서 사용할 때 export, export default를 사용하는 건 알고 있다.

근데 잘 모른다.

한번 정리해둬야지...

 

차이점

• export

export 한 이름으로 import 해야 한다.

원하는 이름으로 하려면 as를 사용해야 한다.

 

• export default

원하는 이름으로 import 할 수 있다.

파일당 하나만 export가 되는 거라 무슨 이름을 써도 상관없는 것 같다.

 

// index.js

export default hello = () => {
	cnosole.log('hello');
}

export hi = () => {
	console.log('hi');
}

// main.js

// hello 함수가 import 된다. 이름을 변경해서 사용가능
import hellohello from './index'

// hello 함수가 import 된다.
import byebye from './index'

// hi 함수가 import 된다. export는 선언된 이름으로 import 받아야한다.
import { hi } from './index'

// hi 함수를 이름 바꿔 사용하려면 as를 사용한다.
import { hi as hihihi } from './index'

// export, export default 한 번에 import 가능
import { default as byebyebye, hi } from './index'