[babel] Module not found: Error: Can't resolve 'core-js/modules/es6.string.repeat'

개요

webpack 4.41.3, babel 7.7.5 환경인데 아래와 같은 오류를 만났다.

Module not found: Error: Can't resolve 'core-js/modules/es6.string.repeat'

본문

결론부터

core-js 의 버전이 안 맞아서 발생하였다.

셋팅하던 과정

최신 버전으로 설치하기 위해서.
npm install --save-dev @babel/core @babel/cli @babel/preset-env
를 해주고,

구 브라우저에서 안되는 기능도 있고. doc 을 참조하다가 (https://babeljs.io/blog/2019/03/19/7.4.0)
npm install --save core-js@3

까지 잘 했는데. 문제가 발생했다...

분석

문서를 엄청 살펴보고 다녔다..

결론은 core-js 가 버전이 안 맞아서 그런 것.

babel 7 에서는 core-js 의 디폴트 값이 2 로 설정되어 있다. 이에 대한 설명은 다음의 주소에서 찾아볼 수 있다.
https://babeljs.io/docs/en/babel-preset-env#corejs

조금 더 알아보자면,

build 되면서 (npm run build) 내 경우에 require("core-js/modules/es6.string.repeat"); 같은 코드가 추가가 되었는데,
파일명이 es6.string.repeat 이다. 이것이 어디에서 오는가 해서 찾아보면, 다음의 주소를 찾을 수 있었다.
https://github.com/zloirock/core-js/tree/master/packages/core-js/modules

여기에는 es6.string.repeat 파일이 없다.

짐작해보자면, core-js 3 에서는 es.string.repeat.js 파일이 있고, core-js 2 버전에서는 es6.string.repeat.js 였을 것으로 생각된다.

여기까지 왔다면 눈치챌 수가 있는데...

나의 경우는 npm 으로 설치는 core-js 3 으로 해놓은 상태였고, babel 에서 만들어놓은 코드에서는 core-js 2 버전대의 모듈을 호출하고 있었던 것. 파일명이 이번처럼 엇갈렸을 경우에는 파일이 없으므로 그에 대한 메시지가 발생하는 것이다.

종합

.babelrc 에서 corejs : 3 설정을 추가함.