export, export default 차이

chanykim·2022년 2월 11일
0

참고
https://ko.javascript.info/import-export#ref-4122

mysql을 연결하고 다른 .ts파일에서 사용하려고 import를 하였습니다.

//mysql.ts
export default connection;

//app.js
import { connection } from './mysql';

그런데 위와 같이 쓰면 import 에러가 났었습니다.
그래서 중괄호를 없애보았더니 에러가 사라졌습니다.

어떠한 차이가 있었는지 찾아보았는데,
우선 export로 보내면 여러 변수나 함수, 클래스를 내보낼 수 있습니다.
하지만 이렇게 모듈을 만들다 보면 자연스레 파일 개수가 많아질 수밖에 없습니다.
그렇더라도 모듈 이름을 잘 지어주고, 폴더에 파일을 잘 나눠 프로젝트를 구성하면 코드 탐색이 어렵지 않으므로 이는 전혀 문제가 되지 않습니다.
여기서 모듈은 export default라는 특별한 문법을 지원합니다.
export default를 사용하면 '해당 모듈엔 개체가 하나만 있다’는 사실을 명확히 나태낼 수 있습니다.
그래서 db에서 export default를 사용 했으니 중괄호 없이 가져와야 했던 것입니다.

에러 없이 export - import

//mysql.ts
export { connection };

//app.js
import { connection } from './mysql';
//mysql.ts
export default connection;

//app.js
import connection from './mysql';
profile
오늘보다 더 나은 내일

0개의 댓글