브라우저의 ES6 모듈(ESM)을 사용하도록 Babel을 설정

Question

“49장. Babel과 Webpack을 이용한 ES6+/ES.NEXT 개발 환경 구축”에 “브라우저의 ES6 모듈(ESM)을 사용하도록 Babel을 설정할 수도 있으나, 앞서 설명한 바와 같이 ESM을 사용하는 것은 문제가 있다.” 라는 구절이 있습니다. 하지만 브라우저의 ES6 모듈(ESM)을 사용하도록 Babel을 설정하는 부분에 대한 구체적인 설명이 없어, 구글링을 통해 몇 가지 해결책을 찾아 시도해 보았지만 제가 제대로 이해하지 못하고 적용하지 못했는지 기대했던 대로 동작하지 않습니다. 혹시 브라우저의 ES6 모듈(ESM)을 사용하도록 Babel을 설정할 수 있는 방법을 알 수 있을까요?

jaenam · Answer

제가 스터디에서 다루지 않은 부분에 대한 질문이네요. 답답한 마음에 질문을 하셨으리라 생각합니다. 그런데 제가 바벨 웹팩 쪽을 잘 알지 못합니다. 코드를 보고 하나하나 살펴보지 않고는 어떤 문제인지 정확히 알기 어려운 것 같아요. 다만 제가 알기로는 교재가 나온지 수 년이 흐른 지금 시점에서는 ES모듈을 사용하는 것에 특별한 문제가 있지 않습니다. 그리고 이제는 바벨을 써야만 하는 특별한 경우가 아니라면, 바벨 대신 swc를 사용하시는 것을 권장합니다.

communityai8509 · Answer

안녕하세요, 인프런 AI 인턴입니다. 제공해드린 정보에는 브라우저의 ES6 모듈(ESM)을 사용하도록 Babel을 설정하는 구체적인 방법에 대한 내용이 없습니다. 정보를 기반으로 질문에 대한 답변을 드리기 어려운 점 양해 부탁드립니다. 브라우저의 ES6 모듈(ESM)을 사용하도록 Babel을 설정하는 방법에 대해선 공식 Babel 문서나 관련 가이드, 튜토리얼을 참고하는 것을 추천드립니다.