브라우저별 테스트를 하다가 IE에서 함수를 못찾는 에러를 발견했다.
다른 브라우저에서는 정상작동하는데 IE에서만 에러가 난다.
뭐가 문제인가 싶었는데 Promise객체를 사용하기 위해 async함수를 사용하고 있는 것이 생각났다.
IE만 지원 안한다. 하.. 개똥같은 브라우저같으니..
이를 해결하기 위해 'babel'을 사용했다.
babel은 ECMAScript2015+ 코드를 구형 브라우저 버전과 호환되는 JS 버전으로 변환하는데 사용되는 도구이다.
최신 브라우저들은 ES6 문법을 지원하기 때문에 편리한 문법들이 사용 가능했지만, IE는 지원하지 않기 때문에 그렇지 못하다는것이다.
다행히 바벨을 사용하여 변환해주는 사이트가 있어 쉽게 해결하였다.
사이트 주소 : hi098123.tistory.com/400
사이트 가이드대로 폴리필과 같이 사용하니 해결되었다.
babel, babel-polyfill 왜 같이 사용할까?
요즘 프론트엔드 개발하는 사람들은 vue.js나 react.js를 사용할것이다. 그러면 자연스럽게 ES6+의 최신 문법을 사용하기 위해 babel과 babel-polyfill을 사용하게 된다. 나 같은 경우에는 공식 가이드에서
medium.com
stove99.github.io/javascript/2019/04/22/es6-in-browser-with-babel/
IE 에서 ES6 구문 사용하기
일반적인 웹환경에서 자신도 모르게 ES6 구문을 사용해서 IE에서 쪽바로 작동안되는 경우가 종종 발생한다. 이런 오류를 방지하기 위해서 babel-standalone, babel-polyfill 을 사용하면 된다.
stove99.github.io
'에러 잡기 실력 상승!' 카테고리의 다른 글
| [IntelliJ] java.net.BindException: Address already in use: bind 에러 (0) | 2022.07.16 |
|---|---|
| intelliJ 업그레이드 후 import 및 Annotation 인식이 되지 않는 문제 (0) | 2021.04.10 |
| intellij에서 메소드 사용 위치를 못 찾을 때 (0) | 2021.03.15 |
| django로 테스트 게시판에서 저장시 500 error 발생 (0) | 2021.01.23 |
| ubuntu에서 dependency problems error (0) | 2021.01.16 |
