[rollup] Error: 'typeOf' is not exported 에러

레인지 슬라이더 모듈 개발을 위해 rollup을 사용하고 있는데 Styled Components 적용 이후 충돌이 발생했고, 

정확한 에러 메시지는 아래와 같다!

 

2: //# sourceMappingURL=styled-components.esm.js.map
Error: 'typeOf' is not exported by node_modules\react-is\index.js, imported by node_modules\styled-components\dist\styled-components.esm.js
    at error (C:\Users\kowoo\github\codesquad\range-slider\node_modules\rollup\dist\shared\rollup.js:7917:30)
    at Module.traceVariable (C:\Users\kowoo\github\codesquad\range-slider\node_modules\rollup\dist\shared\rollup.js:10240:29)
    at ModuleScope.findVariable (C:\Users\kowoo\github\codesquad\range-slider\node_modules\rollup\dist\shared\rollup.js:9018:39)
    at FunctionScope.findVariable (C:\Users\kowoo\github\codesquad\range-slider\node_modules\rollup\dist\shared\rollup.js:3240:38)
    at ChildScope.findVariable (C:\Users\kowoo\github\codesquad\range-slider\node_modules\rollup\dist\shared\rollup.js:3240:38)
    at Identifier.bind (C:\Users\kowoo\github\codesquad\range-slider\node_modules\rollup\dist\shared\rollup.js:4169:40)
    at CallExpression.bind (C:\Users\kowoo\github\codesquad\range-slider\node_modules\rollup\dist\shared\rollup.js:2490:23)
    at CallExpression.bind (C:\Users\kowoo\github\codesquad\range-slider\node_modules\rollup\dist\shared\rollup.js:6589:15)

 

에러만 가지고 구글링했더니 별다른 해결책이 안나와서 공식 문서에서 발견.

알고보니 터미널에서 처음에 링크로 주더라..

 

https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module

rollup.js

 

rollup.config.js 파일의 최상위에 external 프로퍼티로 해당 모듈을 추가하면 해결.

 

rollup.config.js

// before
export default {
  input: 'src/index.tsx',
  // ...
}

// after
export default {
  input: 'src/index.tsx',
  external: ['styled-components'],
  // ...
}

 

 

 

 

 

react + ts 를 적용한 모듈 하나를 개발하는데 트러블슈팅이 마구마구 추가되는 현상이...