regeneratorRuntime is not defined Parcel

Parcel dev서버로 작업 중 async await을 사용하자 문제가 발생했다

Uncaught ReferenceError: regeneratorRuntime is not defined

 

구글링의 결과, 최신(?) 문법인 async를 사용했기 때문에 등장한 문제인 것 같다.

async를 사용한 파일에서 babel-polyfill을 import하라고 했으나....

아마도 이것은 이전 해결방식이었나보다

Babel 7.4.0 이상을 사용하는 경우 위의 polyfill 방법은 해결되지 않는다..!

 

 

 

그래서 아래 방법으로 해결했다

 

npm install regenerator-runtime -D

 

1. 일단 npm으로 regenerator-runtime 설치

 

2. package.json에서(package-lock.json이 있다면 여기도 함께) devDependencies에 잘 추가되었는지 확인해보자

 

3. 문제없이 추가된 것을 확인했다면, 이제 async 사용한 파일에서 설치한 녀석을 import한다

 

import 'regenerator-runtime/runtime';

 

 

 

 

*참고

 

- dev서버를 목적으로 했기 때문에 devDependencies로 추가한 것인데, 빌드 시 문제가 생길지도 모른다. 

백서버와 진행하는 상황이 아니라 확인은 못했지만, 만약 빌드 시 문제가 되면 devDependencies가 아닌 Dependencies쪽으로 설치 후 위 내용을 진행하면 될 것 같다.

 

- 웹팩의 경우 loader와 plugins 옵션 때문에, 추가 설정이 필요할 수 있겠다는 생각이 들었다.

나중에 웹팩 환경에서 작업 시 이 문제로 추가 설정이 필요한 경우라면 이 글의 내용을 업뎃할 것.