[webpack] 에서 ie11 을 테스트하니 SCRIPT1002 (2,4) 오류.

SCRIPT1002 구문 오류라고 표시되고 (2,4) 라고 표시되어있다. 상당히 앞부분에서 오류가 난 것이다.

살펴보면 코드 시작부분의 '(()=>{var ' 이런 구문에서 오류가 발생했다고 추측할 수 있었다.

며칠간 다양한 검색을 해봤는데, 해결책은 생각보다 간단했다. (이유는 잘 모르겠고)

다음을 참고, github.com/webpack/webpack/issues/11753

arrow functions in webpackBootstrap with browserslist: "IE >= 11" · Issue #11753 · webpack/webpack

아래쪽에 보면 'amok'이라는 분께서 답글을 남겨주셨는데, webpack의 설정에서 target: ['web', 'es5'] 을 넣으니 해결되었다는 내용이었다.

 

webpack.config.js 파일에서 다음과 같이 설정을 추가한다.

...
module.exports = {
  target: ['web', 'es5'],
  ...
};

 

그리고 빌드를 해보면 잘 생성된 것을 확인할 수 있다. 왜 이런 차이가 발생했는지 모르겠는데... 나의 경우는 webpack 을 5로 올리고 babel 도 7로 올리고 corejs 도 3으로 올렸더니 이런 문제가 발생했다.. 음... 근데 사실 ie는 거의 사용되지 않고 있다고는 한다. 창고에 넣었다가 오랜만에 꺼낸 구형노트북 정도가 아닌 이상에는 사용할 일이 없기는 하다...(en.wikipedia.org/wiki/Usage_share_of_web_browsers 참고) 그래도 혹시 모르니 트랜스파일링 해두도록 하자.