• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

babel.config.js 폴리필 관련 질문있습니다.

22.10.06 18:45 작성 조회수 234

0

위의 글을 읽어보니 현재 기준 버전의

babel-preset-env 에서 async await도 지원을해준다는

사실을 알게되었습니다.

헌데 강의 시점!!! 영상에서 궁금한것이있습니다

선생님께서

Promise의 처리를위해

useBuiltIns:"usage",

corejs:{ version:2} 를 설정해주셨고

해당 설명을 통해 require구문 추가가 가능케 하셨고

npm install code-js@2 를 통해 설치까지 해주셨습니다

 

헌데 영상기준으로

async await 처리하기위해

npm install regenerator-runtime 을 설치해주셨는데

왜 regenerator-runtime은

corejs에서 처럼 babel.config.js에서 설정을 안해주셔도

되는건지 궁금합니다

제 생각으론 폴리필의 추가는 babel.config.js에서 하는 것으로 알고있고 그렇다면 npm 설치 뿐만아니라

코드상 옵션 설정도 해줘야할것같은데 그런 부분이 없는데도

잘 빌드가되어서 이상하다고 생각해서 질문드립니다!!

저는 아래 스크린샷처럼 regenerator-runtime을 추가해줘야한다고 생각했습니다ewqewq.png

답변 1

답변을 작성해보세요.

0

현재 버전의 바벨을 사용하면 async/await을 ie에 맞게 변환해 준다는 말씀이시죠? 저도 몰랐는데 글도 같이 공유해 주시면 고맙겠습니다.

질문에 대해 저는 이렇게 생각했습니다. 웹팩이 바벨을 실행하고, 바벨은 ie를 대상으로 코드 변환작업을 할겁니다. ie에서는 async/await이나 제네레이터를 지원하지 않기 때문에 폴리필을 사용하려고 할텐데요. 이 때 regenrator-runtime/runtime 모듈을 가져오려고 할겁니다. 빌드하면 아래 메세지를 출력하니깐요.

"Module not found: Error: Can't resolve 'regenerator-runtime/runtime' in ..."

image

그렇기 때문에 node_modules 폴더 안에 이 패키지를 설치만 해주면 바벨이 모듈을 찾아주는 것으로 생각합니다.